Skip to content

Jotform lightbox embed initializes twice from v2.2 on Firefox and Safari (?) #491

@vbalazs

Description

@vbalazs

Apologies for the crudity of this issue, I tried to debug or understand the issue but this is way above my js-fu so I can only explain the symptom

I have a page in a rails app which embeds a jotform, popping up as a lightbox, below there is a minimal PoC.
Up until es-module-shims v2.1.1, this works as expected, the lightbox pops up on page load and the form appears.
From v2.2.0, there is some kind of double initialization effect. An other, empty lightbox pops up on top, which can be closed with the X button, which reveals the underlying lightbox with the form rendered twice (scroll down within lightbox to observe it).
It breaks in Firefox 138 and Safari 18.4 but in Chrome 136 it keeps working as expected.

This worked since years and the only thing changing is the version of this module. There is some weird interaction with the jotform JS which might signal an unintented side effect introduced in 2.2. The code below has nothing to do with importmaps or modules I believe so it shouldn't break 🤔

For now the workaround is to stick with 2.1.1.

<html>
  <head>
    <!-- I have shims included for rails importmaps but the code below works without it. it also works with 2.1.1 -->
    <script async src="https://ga.jspm.io/npm:[email protected]/dist/es-module-shims.js"></script>
  </head>
  <body>
   <!-- code snippet generated by jotform -->
    <script src="https://form.jotform.com/static/feedback2.js" type="text/javascript"></script>
    <script type="text/javascript">
      var JFL_220465958992371 = new JotformFeedback({
        formId: "220465958992371",
        base: "https://form.jotform.com/",
        windowTitle: "[TEST] Form",
        backgroundColor: "#ffffff",
        fontColor: "#FFFFFF",
        type: "1",
        height: 500,
        width: 700,
        openOnLoad: true
      });
    </script>
  </body>
</html>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions