Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Webview can't call onLoad's callback when source is HTML source code in iOS, but, it'ok for Android. #14550

Closed
rogerluo410 opened this issue Jun 16, 2017 · 9 comments
Closed

Webview can't call onLoad's callback when source is HTML source code in iOS, but, it'ok for Android. #14550

rogerluo410 opened this issue Jun 16, 2017 · 9 comments
Labels
Ran Commands One of our bots successfully processed a command. Resolution: Locked This issue was locked by the bot.

Comments

@rogerluo410
Copy link

rogerluo410 commented Jun 16, 2017 •
edited
Loading

-- Please use this template, and delete everything above this line before submitting your issue ---

Description

The Webview's source is HTML code, will inject JS while onLoad callback executed. This is ok for Android, but, for iOS, the onLoad's callback is even NOT called...

       constructor() {
         super()
        this.webView = null
        this.injectJavaScript = this.injectJavaScript.bind(this)
       }

       injectJavaScript() {
         alert(1);   // Even not walk here
         const bridgeJS = `
           document.addEventListener("message", function(event) {
                window.scrollTo(0, event.data);
           }, false);

          window.addEventListener("message", function(event) {
            window.scrollTo(0, event.data);
          }, false);
        `
         if (this.webView) {
           this.webView.injectJavaScript(bridgeJS)
        }
      }
      <WebView
          ref={ webView => this.webView = webView}
          source={ {html: ' <html><body><div style="height: 3000px;">13232</div></body></html>'} }
          javaScriptEnabled={true}
          domStorageEnabled={true}
          onMessage={this._onMessage}
          onLoad={this.injectJavaScript}
          />

this code works well on Android, but, even NOT call onLoad to inject JavaScript in iOS...
Meanwhile, if I put the HTML to local directory, and use another approach to direct the source like
source={ require('../xxx.html') } is work fine on iOS.

Solution

I want to know why even NOT call onLoad's callback when set source: {html: '...'} in iOS.

But, it's ok for Android with same code...

Help me, thanks!

Additional Information

React Native version: 0.44.2
Platform: iOS / Android
Operating System: MacOS
@colorfulberry
Copy link

Any others suffered this question?

@Mahaswami
Copy link

+1

1 similar comment
@beilunyang
Copy link

+1

@pull-bot
Copy link

@facebook-github-bot no-template

1 similar comment
@pull-bot
Copy link

@facebook-github-bot no-template

@facebook-github-bot
Copy link
Contributor

Hey, thanks for reporting this issue! It looks like your description is missing some necessary information, or the list of reproduction steps is not complete. Can you please add all the details specified in the Issue Template? This is necessary for people to be able to understand and reproduce the issue being reported. I am going to close this, but feel free to open a new issue with the additional information provided. Thanks! See "What to Expect from Maintainers" to learn more.

@facebook-github-bot facebook-github-bot added the Ran Commands One of our bots successfully processed a command. label Oct 10, 2017
@facebook-github-bot
Copy link
Contributor

Hey, thanks for reporting this issue! It looks like your description is missing some necessary information, or the list of reproduction steps is not complete. Can you please add all the details specified in the Issue Template? This is necessary for people to be able to understand and reproduce the issue being reported. I am going to close this, but feel free to open a new issue with the additional information provided. Thanks! See "What to Expect from Maintainers" to learn more.

@facebook-github-bot facebook-github-bot added Needs more information Ran Commands One of our bots successfully processed a command. labels Oct 10, 2017
@amirharel-fyber
Copy link

is this issue going to be fixed?

@Damoness
Copy link

Damoness commented Jul 2, 2018

I has the same issue

@facebook facebook locked as resolved and limited conversation to collaborators Oct 10, 2018
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Oct 10, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
Ran Commands One of our bots successfully processed a command. Resolution: Locked This issue was locked by the bot.
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
9 participants
@Mahaswami @rogerluo410 @Damoness @facebook-github-bot @colorfulberry @beilunyang @pull-bot @react-native-bot @amirharel-fyber