Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Elm app built with EOL2 and minified with Vite using Terser breaks with seemingly innocuous commit #99

Open
Augustin82 opened this issue Aug 10, 2022 · 0 comments

Comments

@Augustin82
Copy link

Hi everyone!

So, I'm building this: https://gitlab.com/incubateur-territoires/startups/deveco/deveco-app

We're using Vite for the building process, with Terser as the minifier. Before that, we use EOL2 to make a JS file out of the Elm sources.
The whole process can be started using yarn build and the resulting application can be see, using the built artifact, using yarn serve and going to the given URL (http://localhost:4173). The app won't "work" because it needs the backend, but it will show stuff on the page.

Now, up to and including commit c0a47511665edff7d005178cf487a6ad81459efa, everything was working fine.
Then, commit 96fa0fcdcd11720750bdae40b0e3c99d31a207f3 happened, with what seems to me very trivial changes.

But, while the building process still works great, the resulting app crashes, because of the following error:
In Brave:

Uncaught TypeError: Cannot read properties of undefined (reading 'parentNode')
    at index.365495c1.js:formatted:1751:27
    at ee (index.365495c1.js:formatted:1756:14)
    at ne (index.365495c1.js:formatted:1742:21)
    at re (index.365495c1.js:formatted:1736:37)
    at index.365495c1.js:formatted:2105:21
    at me (index.365495c1.js:formatted:2120:9)
    at index.365495c1.js:formatted:2100:20
    at Pr (index.365495c1.js:formatted:950:17)
    at index.365495c1.js:formatted:2094:16
    at Object.init (index.365495c1.js:formatted:99:32)

In Firefox:

Uncaught TypeError: r is undefined
    ee http://localhost:4173/assets/index.365495c1.js:1
    ee http://localhost:4173/assets/index.365495c1.js:1
    ne http://localhost:4173/assets/index.365495c1.js:1
    re http://localhost:4173/assets/index.365495c1.js:1
    de http://localhost:4173/assets/index.365495c1.js:1
    me http://localhost:4173/assets/index.365495c1.js:1
    de http://localhost:4173/assets/index.365495c1.js:1
    Pr http://localhost:4173/assets/index.365495c1.js:1
    de http://localhost:4173/assets/index.365495c1.js:1
    n http://localhost:4173/assets/index.365495c1.js:1
    <anonymous> http://localhost:4173/assets/index.365495c1.js:1

Here's the offending function, pretty-printed:

  function ee(r, n) {
    switch (n.$) {
      case 0:
        return function (r, n, e) {
          var t = r.parentNode,
          u = Zn(n, e);
          return u.elm_event_node_ref || (u.elm_event_node_ref = r.elm_event_node_ref),
          t && u !== r && t.replaceChild(u, r),
          u
        }(r, n.s, n.u);
      case 4:
        return Ln(r, n.u, n.s),
        r;
      case 3:
        return r.replaceData(0, r.length, n.s),
        r;
      case 1:
        return ne(r, n.s);
      case 2:
        return r.elm_event_node_ref ? r.elm_event_node_ref.j = n.s : r.elm_event_node_ref = {
          j: n.s,
          p: n.u
        },
        r;
      case 6:
        for (var e = n.s, t = 0; e.i > t; t++) r.removeChild(r.childNodes[e.v]);
        return r;
      case 7:
        for (var u = (e = n.s).e, a = r.childNodes[t = e.v]; u.length > t; t++) r.insertBefore(Zn(u[t], n.u), a);
        return r;
      case 9:
        if (!(e = n.s)) return r.parentNode.removeChild(r),
        r;
        var c = e.A;
        return void 0 !== c.r && r.parentNode.removeChild(r),
        c.s = ne(r, e.w),
        r;
      case 8:
        return function (r, n) {
          var e = n.s,
          t = function (r, n) {
            if (r) {
              for (var e = tn.createDocumentFragment(), t = 0; r.length > t; t++) {
                var u = r[t].A;
                un(e, 2 === u.c ? u.s : Zn(u.z, n.u))
              }
              return e
            }
          }(e.y, n);
          r = ne(r, e.w);
          for (var u = e.x, a = 0; u.length > a; a++) {
            var c = u[a],
            i = c.A,
            o = 2 === i.c ? i.s : Zn(i.z, n.u);
            r.insertBefore(o, r.childNodes[c.r])
          }
          return t && un(r, t),
          r
        }(r, n);
      case 5:
        return n.s(r);
      default:
        y(10)
    }
  }

Disabling EOL2 makes the build behave normally.
BUT, leaving EOL2 on and switching to minifying using esbuild instead of Terser ALSO makes the build behave normally.

Feel free to ask for more details if something is unclear =)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant