Lighthouse Performance and Accessibility Testing for "Built for Shopify"

Shopify Apps

Topic summary

Main issue: Difficulty testing an embedded Shopify app’s performance and accessibility because Lighthouse and WAVE analyze the parent Shopify admin window rather than the app inside the iframe. Previous workaround (disabling forceRedirect) no longer works due to session tokens (required to load the app via the parent), blocking standalone testing.

Impact: Automated checks flag metrics like LCP (Largest Contentful Paint) as high, seemingly due to JavaScript in the Shopify parent window—not the embedded app—jeopardizing “Built for Shopify” compliance.

Accessibility: Need to verify screen reader compatibility, but no clear method to target the iframe directly. No confirmed solution shared yet.

Resources shared: Link to Google’s Core Web Vitals guidance (https://web.dev/vitals/).

Open questions:

  • How to run Lighthouse/WAVE on the embedded iframe without parent-frame noise?
  • How Shopify’s admin performance tool attributes metrics for embedded apps and whether parent-frame issues affect app scoring.

Status: Unresolved/ongoing. Multiple developers report similar LCP concerns and are seeking tools and methods to test and improve Web Vitals specifically for the embedded app.

Summarized with AI on January 21. AI used: gpt-5.
1

I’m currently working on meeting the criteria for the “Built for Shopify” designation but I’m running into some issues in the testing of performance and accessibility.

I’m trying to use Lighthouse and Wave for the testing, but my app is embedded, and the tools are reporting the performance and accessibility of the parent Shopify window, not my embedded app in the iframe. From what I’ve read, these tools can’t really test properly when iframes are used. The tools are reporting issues with the page, but they’re in the parent window. I used to be able to just turn off the “forceRedirect” and test, but since the change to session tokens, I can’t do that anymore because the app can’t load unless the parent window loads it with the session token.

Is there a way to test an embedded app while it’s in the iframe using Lighthouse and Wave without getting results from the parent frame?

Also, I’m wondering how the Shopify tool works for testing performance. Is it possible I’m getting wrongly flagged for admin performance because the tools aren’t seeing the iframe properly? As an example, when I run Lighthouse, the LCP is flagged as high, but it’s because of Javascript in the Shopify parent window, not the iframe. Because of this, I’m unable to meet the automated requirements and I’m concerned that it’s not only my embedded app that’s the issue.

Thanks for any insights anyone can provide :slightly_smiling_face:

5 Likes
2

Going to reply to this to hope it gets more attention. I am currently working on something similar and need to be able to test my App’s accessibility as some of our client base might be using screen readers and the like.

Did you find anything?

3 Likes
3

Hey @Jamflynt ,

Unfortunately nothing for accessibility yet, but I did come across some newish Google performance tools if you want to take a look (I haven’t been able to dedicate the time yet).

https://web.dev/vitals/

4

Oh nice, thank you I will check them out for sure. These seem to be a bit more helpful.

1 Like
5

Hey @Jamflynt and @Kris_Doyle please let me know if anything works for you we are also trying to get the badge but in the app admin performance it is showing higher lcp values let me know if you know any info that i can use and also any tools for testing the web vitals and improving them

1 Like