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

Empty page with "SyntaxError: expected expression, got '.'" on Firefox 60esr and Chromium 73 #193

Closed
Lomanic opened this issue Jan 26, 2021 · 1 comment

Comments

@Lomanic
Copy link

Lomanic commented Jan 26, 2021

Describe the bug
Matrix.to is broken on Firefox 60esr and all versions before 74 and Chromium 73 and all versions before 80, the page doesn't have any text.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://matrix.to/#/#matrix:matrix.org with Firefox 60esr (any version before 74, see below) or Chromium 73 (any version before 80, see below)
  2. You are only greeted with an empty page, just as if you were visiting https://matrix.to/images/background-1224593451.svg
  3. In the web console, the following error is raised
    SyntaxError: expected expression, got '.' 
    bundle-esm-3551970109.js:1:1314
    

Expected behavior
Page is properly displayed without issue

Desktop:

  • OS: GNU/Linux Debian 9.13 x64
  • Browser Firefox
  • Version 60.9.0esr (64 bits)

Desktop:

  • OS: GNU/Linux Debian 9.13 x64
  • Browser Chromium
  • Version 73.0.3683.75 (64 bits)

Additional context
Matrix.to uses optional chaining (?.), only supported by 85.03% of browsers/users globally according to caniuse. Support in Firefox was introduced with Firefox 74.0 only released 2020-03-10. Support in Chrome/ium was introduced with Chromium 80 only released 2020-02-04.

The issue comes from the following beautified function in https://matrix.to/bundle-esm-3551970109.js

function s(...e) {
    const t = {};
    for (const i of e) {
        if ("string" != typeof i) throw new Error("Invalid enum value name" + i?.toString());
                                                                            // ^___ error raised here
        t[i] = i
    }
    return Object.freeze(t)
}

In my opinion, having a bundle and using these new functions negates the point of simplicity mentioned in the README. The matrix.to links were not broken before the redesign, and while a quite happy Matrix user for a few years now, having the links broken client-side gives a bad image to new potential users about the Matrix ecosystem.

There are basically two solutions for this:

  1. not using this kind of syntax
  2. transpiling with https://babeljs.io/docs/en/babel-plugin-proposal-optional-chaining

While it may be argued that a new version of Firefox ESR is available in Debian 9 repositories (though Mozilla is unfortunately removing a lot of things I use every few versions, so I am really reluctant about upgrading because of this), this is not the case for Chromium.

Unfortunately, there's a trend since last year about websites carelessly breaking client-side while this being completely avoidable (usually missing polyfills or worse using new syntax like here), privileging developers happiness to users usability, and it saddens me quite a bit to see Matrix in the same wagon while I am a big fan and proponent of it.

@Lomanic
Copy link
Author

Lomanic commented Feb 4, 2021

Fixed in a464254, https://matrix.to/#/#matrix:matrix.org is not broken anymore on Firefox 60esr and Chromium 73. Thanks @bwindels.

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