# Annotation Prototype getting wrong "this" in some cases

**URL:** <https://pdfjs.community/t/annotation-prototype-getting-wrong-this-in-some-cases/1222>\
**Category:** Technical Support\
**Created:** [December 7, 2021, 12:42am UTC](https://pdfjs.community/t/annotation-prototype-getting-wrong-this-in-some-cases/1222 "2021-12-07T00:42:47Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![fuse](https://avatars.discourse-cdn.com/v4/letter/f/8e8cbc/32.png) [@fuse](https://pdfjs.community/u/fuse)\
**Post date:** [December 7, 2021, 12:42am UTC](https://pdfjs.community/t/annotation-prototype-getting-wrong-this-in-some-cases/1222/1 "2021-12-07T00:42:47Z")

</div>

**Which product are you using?**  
PDF.js Express Plus

**PDF.js Express Version**  
7.3.9

**Detailed description of issue**

We have a case where we add Checkbox annotations to the viewer. This has been working in production for some time. We use the prototype as per this guide to add event listeners [Customize PDF.js Express From Fields | Documentation](https://pdfjs.express/documentation/forms/styling-form-fields).

The strange thing is, on some environments, we are getting this error:  
Uncaught (in promise) TypeError: this.Im is not a function  
at createInnerElement (CoreControls.js:1484)  
at ba.o.mark.o.wrap.m.CheckButtonWidgetAnnotation.createInnerElement (6660.1a6b71e4b7651d09.js:1)  
at ba.render (CoreControls.js:1987)  
at ba.render (CoreControls.js:438)  
at CoreControls.js:342  
at new Promise ()  
at ba.N\_ (CoreControls.js:342)  
at CoreControls.js:345

When we log, it seems that the “this” context in the prototype function is not the checkbox as we require, but is referring to the global “this” context:

```javascript
        const createInnerElementCheckButton = Annotations.CheckButtonWidgetAnnotation.prototype.createInnerElement;
        Annotations.CheckButtonWidgetAnnotation.prototype.createInnerElement = function() {

            const checkBoxField = this; //<---- "this" here is not always a checkbox element?
            const el = createInnerElementCheckButton.apply(this, arguments);

            el.addEventListener('blur', () => {
                _this.handleSelectionChange([checkBoxField], "deselected");

                setTimeout(() => el.style.outline = `solid 2px ${selectionColour}`);
            });

```

**Expected behaviour**  
“this” should refer to a checkbox

**Does your issue happen with every document, or just one?**  
Seems to be all documents when we are trying to add a checkbox, but strangely on specific environments (All running same version).

**Code snippet**

Creating the fields

```javascript
                const field = new Annotations.Forms.Field(signature.Id, {
                    type: 'Btn',
                    value: signature.Value === "true" ? "On" : "Off",
                });
                annot = new Annotations.CheckButtonWidgetAnnotation(field, {
                    appearance: signature.Value === "true" ? "On" : "Off",
                    appearances: {
                        Off: {},
                        On: {},
                    }
                });

        annotManager.addAnnotation(annot);
        annotManager.redrawAnnotation(annot);

```

Setting up event listeners

```javascript
        const createInnerElementCheckButton = Annotations.CheckButtonWidgetAnnotation.prototype.createInnerElement;
        Annotations.CheckButtonWidgetAnnotation.prototype.createInnerElement = function() {

            const checkBoxField = this; //<---- "this" here is not always a checkbox element?
            const el = createInnerElementCheckButton.apply(this, arguments);

            el.addEventListener('blur', () => {
                _this.handleSelectionChange([checkBoxField], "deselected");

                setTimeout(() => el.style.outline = `solid 2px ${selectionColour}`);
            });
            el.addEventListener('change', e => {
                onInputChange(checkBoxField.fieldName, e.target.checked);
            });

            return el;
        };

```

---

_[View the full topic](https://pdfjs.community/t/annotation-prototype-getting-wrong-this-in-some-cases/1222)._