Open leosvelperez opened 3 months ago
Even when using a standard src/assets
directory, there's an extra small issue with the <img>
tag. If the provided path has a leading /
the image is not resolved correctly, and there's a 404 error in the network tab. If there's no leading /
it works correctly. That is the opposite of what it works for using url()
from the stylesheet. In that case, the asset must have a leading /
.
Below are the Cypress dev server logs for the requests in the application:
GET /assets/logo.svg 404 5.606 ms - -
GET /__cypress/src/assets/logo.svg 200 5.000 ms - -
GET /__cypress/src/logo.svg 200 7.885 ms - -
GET /__cypress/src/OpenSans-Regular.ttf 200 5.762 ms - -
<img>
tag with a src
of /assets/logo.svg
<img>
tag with a src
of assets/logo.svg
/
, otherwise they throw)This is not a major issue. I don't think it's blocking anyone. The <img>
tag source can be set to paths without a leading /
as a workaround. It's inconsistent with how the paths need to be set in the stylesheets, and it might be inconvenient if folks have to change their project's source code to accommodate Cypress CT, though.
Note that the Angular application is correctly served with either path.
I updated the shared repo to showcase this as well. The branch https://github.com/leosvelperez/ng-cypress-ct-issue/tree/standard-assets-dir has the standard src/assets
directory where it can be seen the stylesheets resolving the assets correctly, but the <img>
tag with the leading /
(the same path used in the stylesheets) doesn't work.
We are also facing this issue and it's causing our component tests to fail. Any help from Cypress team would be appreciated!
Would be great if someone could help here
Same issue here as well
Raised an issue NX side that has a repro in #27344 but looking at other reports on the NX page, seems to be a Cypress issue (which is how i found this thread)
Current behavior
When running Cypress CT on an Angular project where assets are copied from a directory structure other than
<project-root>/src/assets
to/assets
(probably when the number of path segments is different between source and destination), the assets can't be resolved from stylesheets. Serving the application works correctly.When running Cypress CT (
ng run <project>:ct
), the image is not displayed and an error is printed in the terminal:Desired behavior
Running Cypress CT on an Angular project should work correctly and resolve assets regardless of their directory structure as long as their configuration is correct and they work when serving the application.
Test code to reproduce
Repo: https://github.com/leosvelperez/ng-cypress-ct-issue
Reproduction steps:
Cypress Version
13.8.1
Node version
v20.12.0
Operating System
macOS 14.4.1
Debug Logs
No response
Other
No response