Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Next.js 12 + adyen-web not working in IE11

See original GitHub issue

Describe the bug We are using this library together with Next.js 10/11 and it was working so far in IE11 (which we unfortunately have to support). Now after we upgraded Next.js to version 12, it doesn’t work anymore in IE11.

Upon calling the constructor - and it doesn’t matter if it’s done like this:

const checkout = await AdyenCheckout(configuration) // V5

… or like this:

const checkout = new AdyenCheckout(configuration) // V4

I get a crash which looks like this (see screenshots).

Here’s a sample project where this problem occurs:

If you need more details feel free to ask.

Expected behavior I would expect this library to work like in any other browser 🙂

Screenshots image

Desktop (please complete the following information):

  • Tested in Windows 10/IE11 (Browserstack)

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:12 (4 by maintainers)

github_iconTop GitHub Comments

Knusperchickencommented, Dec 21, 2021

Yes, the new release solves the issue we were facing - thanks guys 👍🏻

ribeiroguilhermecommented, Dec 10, 2021

@danielnehrig direct imports does not work in the current adyen-web version inside a server side environment. Good news is that it is fixed on #1384 , which will be part of the next release.

Regardless of that, the library still needs to be instantiated in a browser environment. On Next.js you can do that loading with no SSR

Related issue: #902

Read more comments on GitHub >

github_iconTop Results From Across the Web

Importing adyen-web in next.js · Issue #902 - GitHub
hey, we are unable to include the adyen web-package in our next.js app, as the following error occurs as soon as we import...
Read more >
nextjs ie11 Expected identifier - Stack Overflow
1 Answer 1 · add config.optimization.minimize = false; to you next.config. · run a production build · run it on the browser throwing...
Read more >
Release notes - Adyen Docs
Learn about the latest updates to our API, and Drop-in/Components for web, iOS, ... Fixed the known issue from v5.25.0 where the Stored...
Read more >
Browser support issues in Next.js - My blog
When I decided to use Next.js to build the website, I didn't think too much about the support of IE. So I was...
Read more >
Adyen Web / Next.js - CodeSandbox
Activating extension 'vscode.typescript-language-features' failed: Could not find bundled tsserver.js.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found