[bug] tokens.at is not a function

[gorner]

Marked version:
15.0.2

Describe the bug
After upgrading from v14, our app started getting error reports with the following text:

t.at is not a function. (In 't.at(-1)', 't.at' is undefined)
Please report this to https://github.com/markedjs/marked.

... so I am doing as instructed 😛

The immediate stack trace reads:

assets/node_modules/marked/lib/marked.umd.js:1522:0:in `at'

                }
                if (this.state.top && (token = this.tokenizer.paragraph(cutSrc))) {
                    const lastToken = tokens.at(-1);
                    if (lastParagraphClipped && lastToken?.type === 'paragraph') {
                        lastToken.raw += '\n' + token.raw;

To Reproduce
Unclear as this only arose through our error logging. We ended up rolling back the marked upgrade, but if/when we find out more information about a specific reproduction path, we will update.

However our logging indicates this error only occurs on a limited range of older browser versions, including Safari 15.3 and earlier, and Chrome 125 and earlier, and it appears the .at() method is not supported on Safari before v15.4 (though supposedly it's supported in Chrome 92+ making the error there a bit more curious). It's not clear whether Marked still supports these versions as the readme currently only says "not IE11".

Expected behavior
The parsing works as expected / without error.

[UziTech]

We don't officially support any browsers but we support nodejs >=18 which I believe is es2022 so any browsers that support es2022 should work.

If you need support for older browsers using babel to transpile marked to your target browsers should work. If it doesn't, feel free to create an issue for that.

[gorner]

@UziTech Thanks for the reply. For the record we currently have safari > 14.1.2, chrome > 57 specified in our .browserslistrc (which should be used by Babel) so if this was something Babel would catch/transpile it should have done so. It doesn't appear Babel transpilation handles changes in syntax like this in and of itself, but we could set up a polyfill (with additional packages and config). Or we could just update our browser targets, or stay on v14 for now.

Ultimately it is of course your call whether to modernize syntax, and doing so in a major version bump as you did makes sense. I would just suggest updating the release notes and/or README to reflect this, as it is a breaking change.

[UziTech]

I would just suggest updating the release notes and/or README to reflect this, as it is a breaking change.

If you would like to help list every possible things that can break between each breaking change, that would be very helpful😁👍

[Bram-diederik]

Old browsers. this issue affects all Debian bookworm QT web browsers.

Edit: need to check its the exact same bug but the render does not work in debian stable with the falkon browser.

But the falkon browser is a way faster browser than firefox and chromium. A blessing on system with 4gig ram and old processor..
Where not promoting ewaste here are we?

[UziTech]

@Bram-diederik if you would like to release a marked package that is transpiled and polyfilled for browsers that do not support current standards, no one is stopping you. You will be getting paid twice as much as the marked team is. 😁👍

[smhg]

FWIW when using esbuild or vite, you'll get this error no matter what target you use (as it doesn't polyfill). Array.prototype.at requires a separate polyfill for pre-es2022 browsers (e.g. Safari 14).

One way to polyfill it is:

npm i array.prototype.at

import at from 'array.prototype.at';
at.shim();