Android crash while navigating back to stack screen . #393
Labels
bug:upstream
The bug is caused by a third party library.
bug
Crush'em all.
is:waiting for feedback
Waiting for OP input.
Comments
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
|
@drb1 First of all, congratulations on the reproduction. That is pristine! So I did my little investigation, and this is what I found out:
diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml
index 433c7e2..c569e8f 100644
--- a/android/app/src/main/AndroidManifest.xml
+++ b/android/app/src/main/AndroidManifest.xml
@@ -15,6 +15,7 @@
android:label="@string/app_name"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
android:launchMode="singleTask"
+ android:hardwareAccelerated="false"
android:windowSoftInputMode="adjustResize">
<intent-filter>
<action android:name="android.intent.action.MAIN" />Indeed, after disabling hardware acceleration, the app doesn't crash anymore.
|
|
this solves the problem, but disabling hardwareAccelerated has serious impact on performance of app, hope it will be fixed soon |
|
@drb1 I do understand this is problematic. A user in the diff --git a/src/screens/EmbededVideoDemo.js b/src/screens/EmbededVideoDemo.js
index 1f42739..e6fa5cf 100644
--- a/src/screens/EmbededVideoDemo.js
+++ b/src/screens/EmbededVideoDemo.js
@@ -4,11 +4,16 @@ import HTML from 'react-native-render-html';
const htmlContent = "<p style=\"text-align: left;\">The word <em>ocean</em> comes from the figure in <span style=\"color: #3598db;\"><a style=\"color: #3598db;\" title=\"Classical antiquity\" href=\"https://en.wikipedia.org/wiki/Classical_antiquity\">classical antiquity</a></span>, <a title=\"Oceanus\" href=\"https://en.wikipedia.org/wiki/Oceanus\">Oceanus</a> <small>pronounced </small><span class=\"IPA\" title=\"Representation in the International Phonetic Alphabet (IPA)\"><a title=\"Help:IPA/Greek\" href=\"https://en.wikipedia.org/wiki/Help:IPA/Greek\">[??keanós]</a></span>, the elder of the <a class=\"mw-redirect\" title=\"Titan (mythology)\" href=\"https://en.wikipedia.org/wiki/Titan_(mythology)\">Titans</a> in classical <a title=\"Greek mythology\" href=\"https://en.wikipedia.org/wiki/Greek_mythology\">Greek mythology</a>, believed by the <a title=\"Ancient Greece\" href=\"https://en.wikipedia.org/wiki/Ancient_Greece\">ancient Greeks</a> and <a title=\"Ancient Rome\" href=\"https://en.wikipedia.org/wiki/Ancient_Rome\">Romans</a> to be the divine personification of the <a title=\"Sea\" href=\"https://en.wikipedia.org/wiki/Sea\">sea</a>, an enormous <a title=\"River\" href=\"https://en.wikipedia.org/wiki/River\">river</a> encircling the world.</p>\n<p style=\"text-align: center;\"><iframe src=\"https://www.youtube.com/embed/1La4QzGeaaQ\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"></iframe></p>\n<p style=\"text-align: left;\">Extraterrestrial oceans may be composed of water or other elements and compounds. The only confirmed large stable bodies of extraterrestrial surface <a class=\"mw-redirect\" title=\"Liquids\" href=\"https://en.wikipedia.org/wiki/Liquids\">liquids</a> are the <a title=\"Lakes of Titan\" href=\"https://en.wikipedia.org/wiki/Lakes_of_Titan\">lakes of Titan</a>, although there is evidence for the existence of oceans elsewhere in the Solar System. Early in their geologic histories, <a title=\"Mars\" href=\"https://en.wikipedia.org/wiki/Mars\">Mars</a> and <a title=\"Venus\" href=\"https://en.wikipedia.org/wiki/Venus\">Venus</a> are theorized to have had large water oceans. The Mars ocean hypothesis suggests that nearly a third of the surface of Mars was once covered by water, and a <a title=\"Runaway greenhouse effect\" href=\"https://en.wikipedia.org/wiki/Runaway_greenhouse_effect\">runaway greenhouse effect</a> may have boiled away the global ocean of Venus. Compounds such as <a title=\"Salt (chemistry)\" href=\"https://en.wikipedia.org/wiki/Salt_(chemistry)\">salts</a> and <a title=\"Ammonia\" href=\"https://en.wikipedia.org/wiki/Ammonia\">ammonia</a> dissolved in water lower its freezing point so that water might exist in large quantities in extraterrestrial environments as brine or convecting <a title=\"Ice\" href=\"https://en.wikipedia.org/wiki/Ice\">ice</a>. Unconfirmed oceans are speculated beneath the surface of many <a class=\"mw-redirect\" title=\"Dwarf planets\" href=\"https://en.wikipedia.org/wiki/Dwarf_planets\">dwarf planets</a> and natural satellites; notably, the ocean of the moon <a title=\"Europa (moon)\" href=\"https://en.wikipedia.org/wiki/Europa_(moon)\">Europa</a> is estimated to have over twice the water volume of Earth.</p>";
+const tagsStyles = {
+ iframe: {
+ opacity: 0.99
+ }
+}
const EmbededVideoDemo = () => {
return (
<ScrollView style={{flex: 1}}>
- <HTML html={htmlContent} imagesMaxWidth={Dimensions.get('window').width}/>
+ <HTML tagsStyles={tagsStyles} html={htmlContent} imagesMaxWidth={Dimensions.get('window').width}/>
</ScrollView>
);
};Can you confirm on your side? |
|
yes this also solved the issue, i think this is the best method for now. |
|
I am closing because there is a known workaround and the bug happens upstream. |
3 tasks
|
Thank you for the temporary solution, still not sure how is it possible, that |
|
The current equivalent to this solution, assuming you're using |
|
@marco2216 Thanks man that worked! |
|
As @marco2216 metioned, when you are using plugin(table/iframe) with HTML component containing import HTML from 'react-native-render-html';
import WebView from 'react-native-webview';
import TableRenderer from '@native-html/table-plugin';
// ...
return (
<HTML
source={{html}} // html: Some texts..
WebView={WebView}
renderers={{table: TableRenderer}}
/>
);
// ...First didn't work for me and second did. // import statements..
//...
return (
<HTML
tagsStyles={{ // X
table: {
opacity: 0.99,
},
}}
source={{html}}
WebView={WebView}
renderers={{table: TableRenderer}}
/>
);
// ...// import statements..
//...
return (
<HTML
renderersProps={{ // O
table: {
webViewProps: {
style: {opacity: 0.99},
},
},
}}
source={{html}}
WebView={WebView}
renderers={{table: TableRenderer}}
/>
);
// ... |
eunbae0
pushed a commit
to uoslife/uoslife-client
that referenced
this issue
Jan 29, 2024
# Summary - 안드로이드에서 특정 공지글 진입 시 앱이 강제종료되는 현상을 해결했습니다. - 확인된 바로는 표(table)이 있는 공지글에서 발생하는 현상이었습니다. - `react-native-render-html`과 `@native-html/table-plugin` 두 라이브러리를 사용하는데, 해당 조합에서 발생하는 [버그](meliorence/react-native-render-html#393. - `HTML(imported from 'react-native-render-html')` 컴포넌트에 특정한 prop을 추가함으로서 간단히(검색에 들인 시간과 비교했을 때 매우..) 해결되는 문제였습니다. ```tsx <HTML // with some other props.. renderersProps={{ table: { webViewProps: { style: {opacity: 0.99}, }, }, }} /> ```` # Blackbox - 에러가 무슨 이유로 발생하는지 파악하지 못하였습니다. 그에 따라 저 스타일과 관련된 것으로만 보이는 코드가 어떻게 이 에러를 해결하는지도 알 수가 없었습니다. - 원리를 파악하려면 해당 라이브러리 소스, 심하면 native level까지 뜯어보아야 하는 것으로 보여, 도저히 그렇게 할 엄두는 내지 못했습니다. 그닥 효율적인 방법도 아닌 것 같아서 일단 이대로 두는 게 최선으로 보입니다. # 반성과 느낀 점 - rebuild 배포 후에, UX에 큰 해악을 끼치는 에러를 너무 오래 방치해 두었다는 생각이 듭니다. 다음에는 신경써서 신속하게 고칠 수 있도록 하겠습니다. - QA가 제대로 진행되었다면 배포 전에 파악되지 않았을까 하는 아쉬움도 남습니다. # Allocated issue - close #293 # For reviewers - 말씀드렸다시피 사용자 경험을 심각하게 저하시키는 문제라 가능한 한 빠르게 merge, 변경사항 배포해주시면 좋겠습니다. 감사합니다..
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Oath
I swear that I have completed these tasks before submitting:
Decision table
we claim support for it),
<yyy>is not rendered”Bug Report
React Native
0.61.5
Libraries
Devices
Description
1.Android app crashes while navigating back to stack screen after rendering table content and embedded videos from youtube.
2.Normal behavior when rendering normal html content
3.No crashes while disable {enableScreen } from react-native-screens
The text was updated successfully, but these errors were encountered: