Polaris-react: Page actions do not trigger on iOS app when using onAction property

Created on 8 May 2018  路  5Comments  路  Source: Shopify/polaris-react

Issue summary

Primary and secondary page actions don't work in the Shopify iOS app for embedded apps when using the onAction property of an Action. If you use the url property, it does properly open the url in a new window.

This may have regressed with the latest iOS update and while I'm fairly certain this isn't the best place to submit this issue, I only submitted it because it seems to be tied to the onAction and not the url property which makes me wonder if there's an issue with the EASDK and Polaris.

Expected behavior

Tapping a primary or secondary action that uses the onAction property triggers the function that is tied to that property.

Actual behavior

Nothing appears to happen, no errors and no action is performed.

Steps to reproduce the problem

  1. Create a Page component with a primaryAction that uses the onAction property.
  2. Open the app in the Shopify iOS app.
  3. Click the action you created for the Page.

Specifications

  • Polaris version: 1.14.1 and 2.0.0
  • React version: 16.3.2
  • Browser: None, using Shopify iOS app
  • Device: iPhone X
  • Operating System: iOS 11.3.1
  • Shopify iOS version: 7.1.1
馃悰Bug

Most helpful comment

Like #336, our iOS engineers have been looking into this.

All 5 comments

Using create-react-app and add Polaris 2.0.0, this code reproduces the issue. The primary action won't work, but the secondary will. This works fine for me in the browser, however.

import React, { Component } from 'react';
import { AppProvider, Page } from '@shopify/polaris';

const APP_API_KEY = "api_key_here";
const SHOP_ORIGIN = "https://shop-goes-here.myshopify.com";

export default class App extends Component {
  state = {
    clickCount: 0
  }

  render() {
    const { clickCount } = this.state;
    return (
      <AppProvider
        apiKey={APP_API_KEY}
        shopOrigin={SHOP_ORIGIN}
      >
        <Page
          title="Testing"
          primaryAction={{
            content: "Click me",
            onAction: () => this.setState(state => ({ clickCount: state.clickCount + 1 }))
          }}
          secondaryActions={[
            { content: 'Secondary', url: 'https://www.google.com' }
          ]}
        >
          Click count: {clickCount}
        </Page>
      </AppProvider>
    );
  }
}

I鈥檓 looking into this now, stay tuned.

Like #336, our iOS engineers have been looking into this.

This bug (and #336) appear to be fixed in the latest iOS app release (7.4.0). Thanks for the fix!

Excellent! Thanks :)

Was this page helpful?
0 / 5 - 0 ratings