ionic-team / ionic-team/ionicons

bug: IonIcon giving error with vitest

Open
#1,316 15 comments 0 reactions 0 assignees View on GitHub
help wanted
Dominant language
TypeScript
Stars
18.2k
Forks
2.1k
PR merge metrics
No merged PRs in 30d

Description

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

v7.x

### Current Behavior

While running vitest on the components using IonIcon, the test is failing with following error though the image is rendered properly in the project
Using IonIcon as: ``
error

It works fine when using ion icon with with inbuilt icons provided by ionic but causes issues when we try to use any image url with it.

### Expected Behavior

The IonIcon should work with vitest properly when using image url with it.

### Steps to Reproduce

1. Create any react component in ionic framework.
2. Use IonIcon inside the component as using image path as src in IonIcon.
3. Run Vitest on the component

### Code Reproduction URL
https://stackblitz.com/edit/ionic-react-vitest-example-qfvsxq?file=src%2Fcomponents%2FHeader.tsx

Run the App: npm run dev
Run test suite: npm run test

### Ionic Info

Ionic:

"@ionic/react": "^7.0.10",
"@ionic/react-router": "^7.3.1"

vite:

"vite": "4.3.9",
"vite-plugin-dts": "2.3.0",
"vite-plugin-eslint": "^1.8.1",
"vite-plugin-svgr": "^4.2.0",
"vite-tsconfig-paths": "^4.0.2",
"vitest": "0.32.0"

### Additional Information

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.