simonsmith/cypress-image-snapshot

TypeError: (0, just_extend_1.default) is not a function

balassy opened this issue ยท 10 comments

Hello Simon,

Since we have upgraded this module to version 7.0.0 we have runtime errors with Cypress:

TypeError: (0, just_extend_1.default) is not a function

It is coming from the just-extend package call in the getNameAndOptions function in command.ts.

For some reason webpack does not load the just-extend package, but instead only returns its URL on the server. The server has the compiled js file for just-extend, but webpack does not download it.

I understand this is probably an issue with our app's webpack configuration, but I'd appreciate any help because I could not find a solution for it.

Thank you for improving this module and keep sharing it with the community!

Hey @balassy, what situation are in you in where this is being run on the server? Just so i can get an idea of how it could be reproduced

Thanks for the quick response, I appreciate it.
By server I mean the Cypress host from where Cypress downloads all of its static files.

So you see this in the console of the Cypress runner?

Yes:
image

Is it possible to recreate a reproducible example? Perhaps a simple example repo?

The same issue happened to me.

To give a bit of context: I have been using this plugin as part of the Cypress component testing in a monorepo with a custom webpack configuration inside the component.devServer.webpackConfig of cypress.config.ts file and everything works fine.

Recently, when I wanted to replicate a similar config in a web application that was created using create-react-app. In order to get rid of the maximum code as possible, and trying to reuse the already existing CRA webpack config, I removed component.devServer.webpackConfig and replaced component.devServer.framework: 'react' by component.devServer.framework: 'create-react-app', what caused the error to appear.

Therefore, I tried to use the same settings of the monorepo and everything runs well, so I guess it's related to the default configuration of CRA but not sure why.

Is your app a create-react-app by any chance? @balassy

Thanks @xcanchal-ut , changing component.devServer.framework from create-react-app to react solved the problem!

I could swear that a long time ago for some already forgotten reason we needed the create-react-app value, but I guess that's now gone because of updating our many dependencies. Anyways, thanks for your help, I'm closing this issue now.

I have faced the same issue with create-react-app framework, but in my case, I cannot change it just to react, since we use CRA in our project.
I fixed it using by overriding loader for just-extend in cypress.config.ts:

import { defineConfig } from 'cypress';
import { Configuration } from 'webpack';
import { addMatchImageSnapshotPlugin } from '@simonsmith/cypress-image-snapshot/plugin';
import * as path from 'path';

export default defineConfig({
  component: {
        devServer: {
            framework: 'create-react-app',
            bundler: 'webpack',
+            webpackConfig: (): Partial<Configuration>  => ({
+                resolve: {
+                    alias: {
+                        'just-extend': path.resolve(__dirname, 'node_modules/just-extend/index.mjs'),
+                    },
+                },
+            }),
        },
        setupNodeEvents(on) {
            addMatchImageSnapshotPlugin(on);
        },
    },
})

Thanks for adding your solution. I can probably stop this happening by just inlining that utility. Will take a look into it

๐ŸŽ‰ This issue has been resolved in version 9.0.0 ๐ŸŽ‰

The release is available on:

Your semantic-release bot ๐Ÿ“ฆ๐Ÿš€