jsdf / react-native-htmlview

A React Native component which renders HTML content as native views
ISC License
2.72k stars 466 forks source link

TypeError: Cannot read property 'style' of undefined #311

Open sarkar4540 opened 3 years ago

sarkar4540 commented 3 years ago

JSX Code:

<HTMLView value={this.state.test.test.details} />

The following error has occurred.

TypeError: Cannot read property 'style' of undefined
Module.../../../../../../../../../home/sarkar4540/Code/sarkar nigam/magnox/test-system/node_modules/react-native-htmlview/HTMLView.js
node_modules/react-native-htmlview/HTMLView.js:149
  146 | renderNode: PropTypes.func,
  147 | RootComponent: PropTypes.func,
  148 | rootComponentProps: PropTypes.object,
> 149 | style: ViewPropTypes.style,
      | ^  150 | stylesheet: PropTypes.object,
  151 | TextComponent: PropTypes.func,
  152 | textComponentProps: PropTypes.object,
View compiled
__webpack_require__
/home/sarkar4540/Code/sarkar nigam/magnox/test-system/webpack/bootstrap:789
  786 | };
  787 | 
  788 | // Execute the module function
> 789 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
      | ^  790 | 
  791 | // Flag the module as loaded
  792 | module.l = true;
View compiled
oussamabenkortbi commented 2 years ago

same problem

BrianWendt commented 2 years ago

Same problem nearly a year later.


"dependencies": {
    "@expo/webpack-config": "^0.17.0",
    "@react-native-async-storage/async-storage": "~1.17.3",
    "@react-native-picker/picker": "2.4.2",
    "@react-navigation/drawer": "^6.3.1",
    "@react-navigation/native": "^6.0.8",
    "@react-navigation/native-stack": "^6.5.0",
    "axios": "^0.26.1",
    "expo": "^46.0.0",
    "expo-checkbox": "~2.2.0",
    "expo-linear-gradient": "~11.4.0",
    "expo-linking": "~3.2.2",
    "expo-notifications": "~0.16.1",
    "expo-splash-screen": "~0.16.2",
    "expo-status-bar": "~1.4.0",
    "expo-updates": "~0.14.6",
    "formik": "^2.2.9",
    "moment": "^2.29.1",
    "react": "18.0.0",
    "react-dom": "18.0.0",
    "react-native": "0.69.6",
    "react-native-gesture-handler": "~2.5.0",
    "react-native-htmlview": "^0.16.0",
    "react-native-maps": "0.31.1",
    "react-native-reanimated": "~2.9.1",
    "react-native-render-html": "^6.3.4",
    "react-native-safe-area-context": "4.3.1",
    "react-native-screens": "~3.15.0",
    "react-native-web": "~0.18.7",
    "react-native-web-maps": "^0.3.0",
    "yup": "^0.32.11"
  },
krishnacharyGITHUB commented 2 years ago

HTMLView.js:149 Uncaught TypeError: Cannot read properties of undefined (reading 'style') at Module../node_modules/react-native-htmlview/HTMLView.js (HTMLView.js:149:1) at webpack_require__ (bootstrap:789:1) at fn (bootstrap:100:1) at Module../node_modules/react-native-htmlview/index.js (index.js:1:1) at webpack_require (bootstrap:789:1) at fn (bootstrap:100:1) at Module../reactNativeCode/ProfilePage.js (ProfilePage.js:1:1) at webpack_require (bootstrap:789:1) at fn (bootstrap:100:1) at Module../reactNativeCode/SideBarProfileMenu.js (Reciept.js:198:1) at webpack_require (bootstrap:789:1) at fn (bootstrap:100:1) at Module../App.js (bootstrap:856:1) at webpack_require (bootstrap:789:1) at fn (bootstrap:100:1) at Module../node_modules/expo/AppEntry.js (AppEntry.js:1:1) at __webpack_require (bootstrap:789:1) at fn (bootstrap:100:1) at Object.1 (SignupPage.js:100:1) at __webpack_require__ (bootstrap:789:1) at bootstrap:856:1 at bootstrap:856:1

mariomurrent-softwaresolutions commented 1 year ago

Issue still exists in web version

jeanmarie15 commented 1 month ago

for me the issue started when I upgraded the RN version, to solve it I just changed the value from ViewPropTypes.style to PropTypes.object in HTMLView file propTypes

HtmlView.propTypes = { addLineBreaks: PropTypes.bool, bullet: PropTypes.string, lineBreak: PropTypes.string, NodeComponent: PropTypes.func, nodeComponentProps: PropTypes.object, onError: PropTypes.func, onLinkPress: PropTypes.func, onLinkLongPress: PropTypes.func, paragraphBreak: PropTypes.string, renderNode: PropTypes.func, RootComponent: PropTypes.func, rootComponentProps: PropTypes.object, style: PropTypes.object, stylesheet: PropTypes.object, TextComponent: PropTypes.func, textComponentProps: PropTypes.object, value: PropTypes.string, };