Re: Embedded app TitleBar links are wrong when app URL is visited directly (not through admin > A

Solved

Embedded app TitleBar links are wrong when app URL is visited directly (not through admin > Apps)

Jeff-Blake
Shopify Partner
43 0 9

Strange bug that seems to be new behavior.

 

If I visit my app directly, e.g. https://myapp.com, App Bridge React will redirect to the embedded app in Shopify admin (with the forceRedirect setting). All good there. App bridge redirects to /admin/apps/{api-key}

 

Now when the app finally loads the TitleBar component, all the links in the navigation bar are for example "/admin/apps/{api-key}/admin/apps/{app-handle}/path

 

There is an extra "admin/apps/{api-key}" in there.

 

See DOM element inspected:

 

Screen Shot 2020-01-31 at 6.35.26 PM.png

 

I'm running the latest version of everything:

 

Polaris 4.12.0

App Bridge 1.15.0

App Bridge React 1.15.0

Accepted Solution (1)
Trish_Ta
Shopify Staff
58 13 28

This is an accepted solution.

This issue should be fixed now. Thank you for your patience.

Trish | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

View solution in original post

Replies 10 (10)

amardeep
Shopify Partner
18 0 17

Having the same issue. Everything was working fine yesterday and today I am getting 404 with an additional/admin/apps/ getting added in the urs from somewhere. 

 

Team Shopify please look into this.. Many people are having this issue and I can see it in several threads. 

Beautifully designed posts for social media. Inboxed daily!
Shopify App: Automatic Post Designer
Dan_Sundy
Shopify Partner
31 0 4

This is still a problem.

 

Just wanted to confirm that this doesn't have to happen with a redirect, it is an issue any time the api key is used as opposed to the app handle.

 

Please fix asap!

chrisandrewca
Shopify Partner
9 0 15

Can confirm. Thanks for raising this issue. Aside - will the app-bridge github repos become public in the future? It would be nice to collect these reports over there.

 

Repro:

  1. Install app
  2. After auth flow, app successfully loads whitelisted redirect inside admin iframe
  3. Click navigation bar link
  4. 404

can_confirm_s_n.png

 

In addition there's a related issue where <style> tags injected into the apps <head> aren't rendered. (a la next.js)

Repro:

  1. Click admin apps link
  2. Click on app
  3. Load (style may be missing here but I don't have any injected styles on this page)
  4. Click a navigation bar link to a page with injected <style>
  5. Components render unstyled
  6. Press F5 once
  7. Components render styled

Can confirm this was working prior.

Jeff-Blake
Shopify Partner
43 0 9

Agreed, having a Github repo for app bridge and other smaller packages like route-propagator would be great. I don't understand why they are all in the "Quilt" repo - I would think that's a management nightmare. Forum posts get lost in the wind, I'd feel much more confident if I could file a Github issue.

 

As a workaround right now I subscribe to the Redirect.ActionType.APP action in componentDidMount and modify the path appropriately if it contains "admin/apps/...", before dispatching to `this.props.history.push` (where react-router takes it from there)

Dan_Sundy
Shopify Partner
31 0 4

Thanks for the suggestion, @Jeff-Blake. I've implemented the same workaround for now. It's not a complete fix as the active link state (underline) doesn't work (I'm assuming because the paths don't match), but it's a whole lot better than a 404 page.

 

Further to the GitHub issues conversation, does anyone at Shopify even know about this problem? I don't see anything related to this in the "Quilt" repo.

Trish_Ta
Shopify Staff
58 13 28

Hi all,

 

Thanks for reporting this issue, we're working on a fix.

Trish | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Trish_Ta
Shopify Staff
58 13 28

This is an accepted solution.

This issue should be fixed now. Thank you for your patience.

Trish | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Dan_Sundy
Shopify Partner
31 0 4

Confirmed that this has been fixed for me. I've been able to remove the work around.

 

Thanks, @Trish_Ta, for getting this fixed on a weekend!

Hoegnison
Shopify Partner
6 0 1

I can confirm that the issue has been resolved for me 🙂 Thanks!

Jeff-Blake
Shopify Partner
43 0 9

Indeed fixed, thanks!