ionic-team / ionic-team/ionicons

bug: IonIcon giving error with vitest

Offen
#1,316 15 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
help wanted
Vorherrschende Sprache
TypeScript
Sterne
18.2k
Forks
2.1k
PR-Merge-Kennzahlen
Keine gemergten PRs in 30 T.

Beschreibung

### 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_

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Start with src/components/Header.tsx in the linked StackBlitz reproduction and run its npm test command to observe the IonIcon failure with an external image URL. Trace the behavior in the ionicons package and verify completion by making the Vitest suite pass while the image URL still renders correctly.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
react, typescript, vite
Bereich
frontend, testing
Issue-Typ
Bug
Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.