danilowoz / danilowoz/react-content-loader
Animation stops working after first render when using React.StrictMode
- Dominant language
- TypeScript
- Stars
- 14k
- Forks
- 421
- PR merge metrics
- No merged PRs in 30d
Description
## What did you do?
I installed react-content-loader v 7.1.1 and used example loader animation from https://skeletonreact.com/ for React Native
```jsx
import React from "react"
import ContentLoader, { Rect, Circle, Path } from "react-content-loader/native"
const MyLoader = (props) => (
)
export default MyLoader
```
## What did you expect to happen?
The ContentLoader animation should continue to loop indefinitely, providing a smooth loading experience regardless of whether StrictMode is enabled.
## What happened actually?
When wrapping a React Native application with `React.StrictMode`, animations from `react-content-loader/native` execute only once during the initial render and then stop indefinitely. The animation does not restart or loop as expected.
- **Without StrictMode**: Animation works correctly and loops continuously ✅
- **With StrictMode**: Animation plays once during initial render, then stops completely ❌
## Console Warning
The following warning appears in the console when using the ContentLoader in StrictMode:
```
findNodeHandle is deprecated in StrictMode. findNodeHandle was passed an instance of LinearGradient which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://react.dev/link/strict-mode-find-node
```
## Which versions of react-content-loader, and which browser are affected by this issue?
```jsx
"dependencies": {
"expo": "53.0.20",
"react": "19.0.0",
"react-content-loader": "^7.1.1",
"react-dom": "19.0.0",
"react-native": "0.79.5",
"react-native-svg": "15.11.2",
},
"devDependencies": {
"@babel/core": "^7.25.2",
"@types/react": "~19.0.10",
"eslint": "^9.25.0",
"eslint-config-expo": "~9.2.0",
"patch-package": "^8.0.0",
"typescript": "~5.8.3"
},
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.