# Search a keyword and annotate it programmatically

**URL:** <https://pdfjs.community/t/search-a-keyword-and-annotate-it-programmatically/691>\
**Category:** Technical Support\
**Created:** [April 8, 2021, 12:14pm UTC](https://pdfjs.community/t/search-a-keyword-and-annotate-it-programmatically/691 "2021-04-08T12:14:15Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![Madhavi](https://avatars.discourse-cdn.com/v4/letter/m/ee7513/32.png) [@Madhavi](https://pdfjs.community/u/Madhavi)\
**Post date:** [April 8, 2021, 12:14pm UTC](https://pdfjs.community/t/search-a-keyword-and-annotate-it-programmatically/691/1 "2021-04-08T12:14:15Z")

</div>

**PDF.js Express Version**  
6.2.1

**Detailed description of issue**  
I have gone through the documentation and setup pdf.js with Vue. For searching a keyword and annotating it programmatically, I have referred the Advanced Search APIs and the sample given(here /documentation/search/advanced-search). The code is the same as the one given in the example. I am getting error when I call the function textSearchInit. Screenshot for reference: [https://nimb.ws/A8ZVkR](https://nimb.ws/A8ZVkR)

Please guide me if something is missing or what went wrong here.

**Expected behaviour**  
The keywords mentioned in the code must be searched and annotated as provided.

**Does your issue happen with every document, or just one?**  
I have tried with the default document

**Link to document**

> **[webviewer-demo.pdf](https://pdftron.s3.amazonaws.com/downloads/pl/webviewer-demo.pdf)**
>
> 911.82 KB

**Code snippet**

```javascript
WebViewer({ 
        path: this.path,
        initialDoc: this.url,
        enableAnnotations: true
      },
      this.$refs.viewer).then((instance) => {
       

    const { docViewer, CoreControls, annotManager } = instance;
   

    docViewer.on('documentLoaded', () => {

    const searchMode = docViewer.SearchMode.e_page_stop;

    const searchOptions = {
      fullSearch: true,
      onResult: (result) => {

        const textQuad = result.quads[0].getPoints();
        const annot = new Annotations.TextHighlightAnnotation();

        annot.X = textQuad.x1;
        annot.Width = textQuad.x2 - textQuad.x1;

        annot.Y = textQuad.y3;
        annot.Height = textQuad.y1 - textQuad.y3;

        annot.FillColor = new Annotations.Color(0, 0, 255, 0.5);
        annot.StrokeColor = new Annotations.Color(0, 0, 255, 0.5);

        annot.Quads = [textQuad];

        annotManager.addAnnotation(annot);
        annotManager.drawAnnotationsFromList([annot])

      }
    }

   

    // start the search
    docViewer.textSearchInit('the', searchMode, searchOptions);
  })
        
})

```

---

_[View the full topic](https://pdfjs.community/t/search-a-keyword-and-annotate-it-programmatically/691)._