# Stuck on issue with open tab

**URL:** <https://discourse.mozilla.org/t/stuck-on-issue-with-open-tab/66877>\
**Category:** addons.mozilla.org\
**Tags:** learning, issue\
**Created:** [September 2, 2020, 5:31pm UTC](https://discourse.mozilla.org/t/stuck-on-issue-with-open-tab/66877 "2020-09-02T17:31:49Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ajaybir\_Randhawa](https://avatars.discourse-cdn.com/v4/letter/a/ed8c4c/32.png) [@Ajaybir\_Randhawa](https://discourse.mozilla.org/u/Ajaybir_Randhawa)\
**Post date:** [September 2, 2020, 5:31pm UTC](https://discourse.mozilla.org/t/stuck-on-issue-with-open-tab/66877/1 "2020-09-02T17:31:50Z")

</div>

Hi, I’m trying to make a search bar extension which is supposed to take the entered information and search it on the website. This is the code so far: [https://prnt.sc/uae512](https://prnt.sc/uae512), [https://prnt.sc/uae58z](https://prnt.sc/uae58z) [https://prnt.sc/uae5jhThe](https://prnt.sc/uae5jhThe) website is [http://getcode.herokuapp.com](http://getcode.herokuapp.com). It’s supposed to search the website based on title entered in the search bar field for the snippet. Any help would be appreciated.  
Thank you.

---

<div class="post-metadata">

**Author:** ![juraj.masiar](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/juraj.masiar/32/30587_2.png) [@juraj.masiar](https://discourse.mozilla.org/u/juraj.masiar)\
**Post date:** [September 3, 2020, 7:37am UTC](https://discourse.mozilla.org/t/stuck-on-issue-with-open-tab/66877/2 "2020-09-03T07:37:55Z")

</div>

**Searching is hard.** Even though it sounds easy.

One solution is to use one of the existing libraries, like MarkJS:

> **[mark.js – JavaScript keyword highlight](https://markjs.io/)**
>
> Search term highlighting intended for every use case. Can be used with plain JavaScript or as jQuery plugin.

If you are targeting Firefox only, you can use Find API:

> **[find - Mozilla | MDN](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/find)**
>
> Finds text in a web page, and highlights matches.

Still, not an easy task at all!  
Some problems to think about:

- many pages renders content “on demand”, like Facebook where data appears only when you scroll down. So you need Mutation Observer to react to those changes. Mutation Observer is not an easy API 🙂.
- single word on the page can consists of multiple nodes, like “ **t** _h_i`s`” (4 nodes!). But both Find API and MarkJS should find it.

---

<div class="post-metadata">

**Author:** ![jscher2000](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/jscher2000/32/28202_2.png) [@jscher2000](https://discourse.mozilla.org/u/jscher2000)\
**Post date:** [September 3, 2020, 3:24pm UTC](https://discourse.mozilla.org/t/stuck-on-issue-with-open-tab/66877/3 "2020-09-03T15:24:40Z")

</div>

Hmm, it doesn’t seem that your popup submits a form or passes arguments in the URL to the destination site.
