Stuck on "Navigation error on install"

[TiagoReis]

I cloned the default Shopify React Router from GitHub - Shopify/shopify-app-template-react-router: A template for building Shopify Apps using React Router version 7 and above (not using Remix)

Deployed it to Vercel and can install the app with no issues with a Test Shopify store that we have.

The problem is we’re stuck at “App Store Review”, more specifically on the “Immediately redirects to app UI after authentication“ check.

The error:

Navigation error on install

During an automated check, your app didn’t successfully redirect to a merchant user interface after authentication. The app responded with an unexpected URL. Learn more about installation requirements.

Expected URL: App homepage after installation
Actual URL: https://admin.shopify.com/store/appstoretest9/app/grant?action=eyJjbGllbnRfaWQiOiJhYzZiNWYxMzJmZDkzNWE0Mzg3MWI3ZGYxNTY4OWIwNyIsImFwcF9pZCI6Mjg4MzU0ODYxMDU3LCJmbG93Ijoic2hvcGlmeV9tYW5hZ2VkX2luc3RhbGwiLCJyZWZlcnJlciI6ImFwcF9zdG9yZSIsImFjdGlvbiI6Imluc3RhbGwiLCJwcmVzZW50YXRpb24iOiJwYWdlIn0%3D

I’ve tried a million experiments on auth.$.tsx but currently I have it like this (as per the official shopify template):

import type { HeadersFunction, LoaderFunctionArgs } from "react-router";

import { authenticate } from "../shopify.server";

import { boundary } from "@shopify/shopify-app-react-router/server";




export const loader = async ({ request }: LoaderFunctionArgs) => {

await authenticate.admin(request);




return null;

};




export const headers: HeadersFunction = (headersArgs) => {

return boundary.headers(headersArgs);

};

My shopify.app.toml is as follows:

# Learn more about configuring your app at 





client_id = "ac6b5f132fd935a43871b7df15689b07"

name = "Test Integration App"

application_url = "https://tipple-integration-app.vercel.app"

embedded = true




[build]

automatically_update_urls_on_dev = true




[webhooks]

api_version = "2025-10"




  [[webhooks.subscriptions]]

topics = [ "app/scopes_update" ]

uri = "/webhooks/app/scopes_update"




  [[webhooks.subscriptions]]

topics = [ "app/uninstalled" ]

uri = "/webhooks/app/uninstalled"




  [[webhooks.subscriptions]]

uri = "/webhooks/customers/data_request"

compliance_topics = [ "customers/data_request" ]




  [[webhooks.subscriptions]]

uri = "/webhooks/customers/redact"

compliance_topics = [ "customers/redact" ]




  [[webhooks.subscriptions]]

uri = "/webhooks/shop/redact"

compliance_topics = [ "shop/redact" ]




[access_scopes]

# Learn more at 


scopes = "read_assigned_fulfillment_orders,read_channels,read_companies,read_content,read_custom_fulfillment_services,read_custom_pixels,read_customer_merge,read_customers,read_delivery_customizations,read_discounts,read_discounts_allocator_functions,read_draft_orders,read_fulfillment_constraint_rules,read_fulfillments,read_inventory,read_inventory_transfers,read_locales,read_locations,read_markets,read_markets_home,read_merchant_managed_fulfillment_orders,read_metaobject_definitions,read_metaobjects,read_order_edits,read_order_submission_rules,read_orders,read_product_feeds,read_product_listings,read_products,read_returns,read_shipping,read_third_party_fulfillment_orders,read_validations,write_assigned_fulfillment_orders,write_custom_fulfillment_services,write_custom_pixels,write_customer_merge,write_customers,write_delivery_customizations,write_draft_orders,write_fulfillment_constraint_rules,write_fulfillments,write_inventory,write_inventory_transfers,write_locations,write_markets,write_merchant_managed_fulfillment_orders,write_order_edits,write_order_submission_rules,write_orders,write_products,write_returns,write_shipping,write_third_party_fulfillment_orders,write_validations"




[auth]

redirect_urls = [

"https://tipple-integration-app.vercel.app/auth/callback",

"https://tipple-integration-app.vercel.app/auth/shopify/callback"

]

use_legacy_install_flow = false




[app_preferences]

url = "https://tipple-integration-app.vercel.app"

My shopify.server.ts is the same as shopify-app-template-react-router/app/shopify.server.ts at main · Shopify/shopify-app-template-react-router · GitHub

Can you help? What am I missing?

[sizzlecentral]

Do you have scopes listed in your toml file? You most likely need those in there to authenticate.

E.g., scopes = “write_products”, from the default project.

[TiagoReis]

hi! yes - I pasted my entire shopify.app.toml on my original post - all the scopes are defined there.

[sizzlecentral]

Try adding some error logs so you can debug where things are going wrong. My guess is that some important piece of data like “shop” is getting lost during the redirect.

[TiagoReis]

After endless hours / days trying to circumvent this, I fixed the issue.

My conclusion is simple: Regarding Shopify Automated Checks, Shopify apps get permanently stuck in OAuth authentication mode even when correctly configured for Shopify managed installation (token exchange). This causes automated App Store checks to fail with:

Navigation error on install - app didn't successfully redirect to a merchant user interface after authentication
Actual URL: https://admin.shopify.com/store/[store]/app/grant?action=...

Symptoms

• Automated check redirects to /app/grant (OAuth grant page) instead of completing token exchange
• shopify.app.toml has redirect_urls = []
• Using @shopify/shopify-app-react-router package (which only supports managed installation)
• Manual installation works, but automated checks fail
• No OAuth/redirect URLs visible in Partner Dashboard
• Action parameter shows "flow": "shopify_managed_install" but still uses OAuth

Shopify’s backend caches OAuth configuration from previous settings or initial app creation (?!). This cached configuration:

• Cannot be cleared via CLI commands
• Isn’t visible in Partner Dashboard
• Overrides your TOML configuration
• Persists even after multiple deployments

The Only Solution That Worked for me

Created a completely new app in Partner Dashboard. The cached OAuth configuration appears to be tied to the app ID and cannot be reset.

Steps to Fix

1. Create new app in Partner Dashboard (don’t add redirect URLs)
2. Copy your existing code to new folder
3. Link folder to new app: shopify app config init
4. Update environment variables with new client ID/secret
5. Deploy: shopify app deploy
6. Automated checks will now pass

What DOESN’T Work

• Removing/adding [auth] section in TOML
• shopify app deploy --force --reset
• Waiting for configuration propagation
• Clearing redirect_urls via CLI
• Using use_legacy_install_flow = false