# Annotation Prototype getting wrong "this" in some cases **URL:** \ **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:** 3\ **Page:** 1
**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")
**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; }; ``` ---
**Author:** ![system](https://canada1.discourse-cdn.com/flex031/uploads/pdfjscommunity/original/1X/ffbcd25c7d423db8d5acd5db201c272f4db306dd.png) [@system](https://pdfjs.community/u/system)\ **Post date:** [December 7, 2021, 12:42am UTC](https://pdfjs.community/t/annotation-prototype-getting-wrong-this-in-some-cases/1222/3 "2021-12-07T00:42:51Z")
**Hello, I’m Ron, an automated tech support bot 🤖** While you wait for one of our customer support representatives to get back to you, please check out some of these documentation pages: Guides: - [Customize form field styles](https://pdfjs.express/documentation/forms/styling-form-fields) - [Real-time collaboration client](https://pdfjs.express/documentation/collaboration/realtime-collaboration-client.8) - [Creating custom annotations for your viewer - Saving custom XFDF (optional)](https://pdfjs.express/documentation/annotation/custom-annotations.8#saving-custom-xfdf-(optional)) APIs: - [Core.Tools.StickyCreateTool - setSaveViewState(val)](https://pdfjs.express/api/Core.Tools.StickyCreateTool.html#setSaveViewState__anchor) - [Core.Tools.GenericAnnotationCreateTool - new GenericAnnotationCreateTool(docViewer, annotationPrototype [, constructorArg])](https://pdfjs.express/api/Core.Tools.GenericAnnotationCreateTool.html#GenericAnnotationCreateTool__anchor) - [Core](https://pdfjs.express/api/Core.html#__anchor) Forums: - [Import fails after editing freetext annotation](https://pdfjs.community/t/import-fails-after-editing-freetext-annotation/289/1) - [Is there any CDN url for PDFJS express library](https://pdfjs.community/t/is-there-any-cdn-url-for-pdfjs-express-library/910/15) - [Cannot read property ‘name’ of undefined (core 7.3.2, CoreControls.js:697)](https://pdfjs.community/t/cannot-read-property-name-of-undefined-core-7-3-2-corecontrols-js-697/770/1) ---
**Author:** ![Logan](https://yyz1.discourse-cdn.com/flex031/user_avatar/pdfjs.community/logan/32/13_2.png) [@Logan](https://pdfjs.community/u/Logan)\ **Post date:** [December 9, 2021, 4:58pm UTC](https://pdfjs.community/t/annotation-prototype-getting-wrong-this-in-some-cases/1222/4 "2021-12-09T16:58:37Z")
Hey there! I cannot reproduce your issue unfortunately. In order for me to be able to help here, I’ll need consistent steps to reproduce. Just taking a quick look at the codebase, and I don’t really see how this could be possible. We do not mess with the scope or context of this function at all, so my suspicion is that the issue is coming somewhere on your end. Just a crazy thought, but is your transpiler transforming `function(){}` to `()=>{}` by chance? Something like that would cause the issue you’re seeing. Using the `function` syntax is required in this use case since you want `this` to be bound to the annotation. Logan