Module parse failed: 'import' and 'export' may appear only with 'sourceType: module' (1:0)

[mostafa-rio]

🔎 Have you searched existing issues to avoid duplicates?

• I have made sure that my issue is not a duplicate.

🧪 Have you tested your code using latest version of Synpress?

• I have made sure that my issue still exists on latest version of Synpress.

💡 Are you able to provide enough information to be able to reproduce your issue locally?

• I can provide enough details to reproduce my issue on local environment.

Synpress version

3.7.2-beta.5

Node.js version

18.17

Operating system

Ventura 13

Run mode

Synpress (standalone)

CI platform (if applicable)

No response

Are you running your tests inside docker? (if applicable)

• This issue could be related to docker.

What happened?

after adding Cypress and Synpress to Next.js project and importing
"import '@synthetixio/synpress/support/index' " into support.js
cypress showing error when running tests

    `Error: Webpack Compilation Error
    Module parse failed: 'import' and 'export' may appear only with 'sourceType: module' (1:0)
    You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See 
      https://webpack.js.org/concepts#loaders
    > import './commands';
    | import { configure } from '@testing-library/cypress';
    | 
        at Watching.handle [as handler] (/Users/mostafa/Library/Caches/Cypress/12.17.4/Cypress.app/Contents/Resources/app/packages/server/node_modules/@cypress/webpack-preprocessor/dist/index.js:212:23)`

It obviously yelling because it needs loaders for the import and export that is being used inside "@synthetixio/synpress/support/index" file that we imported in support.js according to the installation section in Synpress repo

What is your expected behavior?

No response

How to reproduce the bug.

To reproduce the bug follow the installation process in a fresh Next.js 13 project

Relevant log output

No response

[jemeza]

Also having this issue with both Synpress (standalone) and as a Cypress plugin.

[drptbl]

@mostafa-rio @jemeza did you try with latest stable version which is @synthetixio/synpress@3.7.1?

[eshavkun]

@drptbl I did. For me it actually started to happen on the working setup that uses older version (3.6.4) so I tried to bump it to 3.7.1 and the issue is still there.

[jemeza]

Currently using Synpress as a plugin for Cypress. The latest version of Synpress that works for me is 3.5.1. I'm using the Cypress and Synpress versions specified in cypress/shared-state. I tried bumping these versions and got those errors.

[mostafa-rio]

@drptbl I tested the stable version (3.7.1) and we have the same error.

[ntee22]

I have the same error, tried everything but couldn't find a way to fix it :(

[philpetrov]

Same error, what version i can use for cypress with no error?

[jemeza]

@philpetrov Use these versions: https://github.com/synpress-io/synpress-examples/blob/master/cypress/shared-state/package.json

[duckception]

I've done some digging, and this error occurs due to an issue with Cypress v12.17.4. If you downgrade to version v12.17.3 or lower in your projects, it should go away.

I'll push a new Synpress release with the fix tomorrow 🫡

[philpetrov]

ok, thanks so much, respect

[duckception]

I've released a new version under the 3.7.2-beta.6 tag that contains the fix! 🚀

Please re-open if the issue somehow persists 🫡

[jeetparikh]

@duckception I am running into the same issue with cypress 13.. I have not used with the previous version but tried adding synpress recently for some e2e testing and running into the same issue above.. any suggestions please? Thanks

[duckception]

Hey @jeetparikh!

Synpress doesn't support Cypress above v12.17.3 because from v12.17.4 onwards they moved from Webpack v4 to v5 (see changelog). You could try making a PR yourself that will resolve this. I'm not sure this is fully working but you could try looking into this repository: https://github.com/YakovL/synpress-cucumber

We currently have no capacity to make this change ourselves as we've working hard on the upcoming version of Synpress which is a complete rewrite of the codebase.

[jeetparikh]

No worries.. thanks for getting back @duckception ... Is that on the roadmap at some point? Because this would definitely be a blocker for a lot of people as Cypress v13 comes with some of it's own goodies..

[duckception]

@jeetparikh Since we're doing a complete rewrite we have a lot on our plate. We're close to an alpha release that focuses on Playwright. After that, our priority will be polishing the "core" of Synpress, implementing missing MetaMask functions, and adding a wallet-agnostic system so we can support more wallets and unlock a few interesting features thanks to that. We don't have any specific roadmap but once all of this is done we will look into adding Cypress support and that would mean supporting the latest versions.

Unfortunately, Cypress support in Synpress relies heavily on Playwright and that's why it's so far on the roadmap. I know this is a bummer 🥲

However, once the alpha release is more or less stable I'll see how hard it would be to add experimental Cypress support though 🫡

[jeetparikh]

sounds good.. thanks @duckception ... appreciate your prompt response