[16.0] Sign Oca problem with sign a document

[anddago78]

Issue in the signature module: When I try to sign a document, if I scroll through the pages and then attempt to sign it, sometimes the click on the signature fields doesn't work. Below, I’m attaching a video so you can see the issue.

Module

sign_oca

Describe the bug

sometimes lost the click event in the signature space...

To Reproduce

Odoo 16 community:

Steps to reproduce the behavior:
1.Create a template,
2. create a request
3. try to sign the document after scrolling the pages

A video for more details:

https://www.loom.com/share/7e44ecef3ed9424f9a650fe63073fe06?sid=d8a25379-7155-4f10-8ca2-3fb1ef8bbbeb

[raul660322]

This issue can be solved modifying the file sign_oca_pdf_common.esm.js:

export default class SignOcaPdfCommon extends Component {
    setup() {
        super.setup(...arguments);
        this.field_template = "sign_oca.sign_iframe_field";
        console.log(this.props);
        this.pdf_url = this.getPdfUrl();
        this.viewer_url = "/web/static/lib/pdfjs/web/viewer.html?file=" + this.pdf_url;
        this.iframe = useRef("sign_oca_iframe");
        var iframeResolve = undefined;
        var iframeReject = undefined;
        this.iframeLoaded = new Promise(function (resolve, reject) {
            iframeResolve = resolve;
            iframeReject = reject;
        });
        this.items = {};
        onWillUnmount(() => {
            clearTimeout(this.reviewFieldsTimeout);
        });
        this.iframeLoaded.resolve = iframeResolve;
        this.iframeLoaded.reject = iframeReject;
        onWillStart(this.willStart.bind(this));
        onMounted(() => {
            this.waitIframeLoaded();
        });
        //Add the code here to include the resize event listener
        window.onresize = ()=> {
            this.waitIframeLoaded();
        }
    }

Also here:

    waitIframeLoaded() {
        var error = this.iframe.el.contentDocument.getElementById("errorWrapper");
       //Include here the scroll event listener
        this.iframe.el.contentDocument.getElementById("viewerContainer")?.addEventListener("scroll", (event) => {  
            this.postIframeFields();
        });  
        
        if (error && window.getComputedStyle(error).display !== "none") {
            this.iframeLoaded.resolve();
            return Dialog.alert(this, _t("Need a valid PDF to add signature fields !"));
        }
        var nbPages =
            this.iframe.el.contentDocument.getElementsByClassName("page").length;
        var nbLayers =
            this.iframe.el.contentDocument.getElementsByClassName(
                "endOfContent"
            ).length;
        if (nbPages > 0 && nbLayers > 0) {
            this.postIframeFields();
            this.reviewFields();
        } else {
            var self = this;
            setTimeout(function () {
                self.waitIframeLoaded();
            }, 50);
        }
    }

[raul660322]

Also, in method postIframeFields() I removed this code:

        iframeJs.setAttribute("type", "text/javascript");
        iframeJs.setAttribute("src", "/sign_oca/get_assets.js");

to avoid error 404

[anddago78]

@raul660322 this solution work perfectly! thanks a lot!!