Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save eyecatchup/b16e91f34dc085eecba2369bc5e17a15 to your computer and use it in GitHub Desktop.
Save eyecatchup/b16e91f34dc085eecba2369bc5e17a15 to your computer and use it in GitHub Desktop.

Revisions

  1. eyecatchup revised this gist Dec 17, 2019. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion ionic-native-cordova-inappbrowser-executescript-ios.md
    Original file line number Diff line number Diff line change
    @@ -10,7 +10,7 @@ To illustrate the issue, let's declare a new InAppBrowser instance:
    const browser = this.iab.create('https://example.com', '_blank');
    ```

    Now, this is would work just fine on Android:
    Now, this would work just fine on Android:

    ```js
    browser.on('loadstop').subscribe(() => {
  2. eyecatchup created this gist Dec 17, 2019.
    53 changes: 53 additions & 0 deletions ionic-native-cordova-inappbrowser-executescript-ios.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,53 @@
    # Ionic Native / Cordova InAppBrowser: Multiple `executeScript` Promises

    I recently worked on a project with Ionic Native and Cordova. One thing I noticed (and took me some time to _resolve_), was an issue with the `then` function of the InAppBrowser plugin's `executeScript` Promise not being executed on iOS.

    > **TL;DR** When you use multiple `executeScript` Promises within one method, the `then` functions will not fire on iOS. You have to `await` results.
    To illustrate the issue, let's declare a new InAppBrowser instance:

    ```js
    const browser = this.iab.create('https://example.com', '_blank');
    ```

    Now, this is would work just fine on Android:

    ```js
    browser.on('loadstop').subscribe(() => {
    browser.executeScript({code: 'window.location'}).then((location) => {
    // do something with location
    });
    browser.executeScript({code: 'document.cookie'}).then((cookies) => {
    // do something with cookies
    });
    browser.executeScript({code: 'console.log("foo")'});
    });
    ```

    However, the code above will fail on iOS. As soon as you use more than one `executeScript` call within the same method, it will no longer run into the `then` functions of the `executeScript` Promise.

    Instead, you have to `await` the results to get it working on iOS. Here's the updated `loadstop` subscription method (note the `async` keyword for the callback function):

    ```js
    browser.on('loadstop').subscribe(async () => {
    let location: any = await this.iabResolveExecuteScript('window.location');
    // do something with location

    let cookies: any = await this.iabResolveExecuteScript('document.cookie');
    // do something with cookies

    browser.executeScript({code: 'console.log("foo")'});
    });
    ```

    And here's the helper method:

    ```js
    iabResolveExecuteScript(code: string) {
    return new Promise((resolve) => {
    browser.executeScript({code: code}).then((result) => {
    resolve(result);
    });
    });
    }
    ```