Pay-app does not load SVG file

[bahmutov]

GET /__cypress/iframes/component/components/NotificationList.spec.js 200 1.501 ms - 794
Webpack Compilation Error
./src/svgs/undraw_reminders_697p.svg (./node_modules/@svgr/webpack/lib?-svgo,+titleProp,+ref!./src/svgs/undraw_reminders_697p.svg)
Module build failed (from ./node_modules/@svgr/webpack/lib/index.js):
Error: Cannot find module '@babel/helper-call-delegate'

The import line

import { ReactComponent as RemindersIllustration } from "../svgs/undraw_reminders_697p.svg";

We do not even get a hit on SVG file load, so something intercepts it before us

[bahmutov]

Tried in stock app https://github.com/bahmutov/try-cra-with-unit-test/blob/master/src/Logo.cy-spec.js SVG working as expected

so it is really something specific to pay-app

[gtsop]

Any updates here? Having a similar problem (if not the same)

[bahmutov]

I don’t have a reproducible example for this issue

Sent from my iPhone

On Nov 13, 2020, at 10:15, George Tsopanoglou notifications@github.com wrote:

 Any updates here? Having a similar problem (if not the same)

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe.

[lmiller1990]

Where can I get pay-app? Updating to Cypress 7.x and the new component testing runner should help. I was able to load images no problem in my demo: https://github.com/lmiller1990/cypress-react-webpack-5-example/blob/master/src/Image.jsx

Info on Cypress 7.x and new component testing runner:

Updated Component Testing intro: https://docs.cypress.io/guides/component-testing/introduction Changelog: https://docs.cypress.io/guides/references/changelog Migration guide: https://docs.cypress.io/guides/references/migration-guide#Component-Testing

Please re-open if someone has a reproducible example.

[jjalonso]

@lmiller1990 The problem is not importing an image. I think the problem is when cypress import a file, and within that file we using import {ReactComponent as whatever} from /something.svg'

Webpack in CRA preprocess the svg with loaders and create a component exported as ReactComponent but cypress ran without webpack and cannot find the exported element.

SyntaxError: Unexpected token
    at EventEmitter.handler (/Users/userx/Library/Caches/Cypress/9.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:69:27)
    at EventEmitter.emit (node:events:390:28)
    at ChildProcess.<anonymous> (/Users/userx/Library/Caches/Cypress/9.7.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:19:22)
    at ChildProcess.emit (node:events:390:28)
    at emit (node:internal/child_process:917:12)
    at processTicksAndRejections (node:internal/process/task_queues:84:21)

[lmiller1990]

Can you share a reproducible example using the latest version of Cypress? You can fork from here: https://github.com/cypress-io/cypress-test-tiny