GoogleChrome / GoogleChrome/lighthouse

Lighthouse not displaying client-side rendered content on mobile version

Open
#12,277 2 comments 0 reactions 1 assignee Claimed by @connorjclark View on GitHub
needs-investigation needs-priority
Dominant language
JavaScript
Stars
30.8k
Forks
9.8k
Avg merge
1d 14h
Merged PRs (30d)
20

Description

#### Provide the steps to reproduce
Run LH or PSI on https://mobexpert.ro/collections/canapele-extensibile (or any other /collections/ page). These are Shopify product category pages that use client-side JS rendering to retrieve a list of products via a third-party service.

#### What is the current behavior?

Both LH and PSI correctly render the desktop version of the page, but fail to render render the list of products for the mobile version. Here's the PSI screenshot:

![lh-current](https://user-images.githubusercontent.com/8843352/111910665-ffefbc80-8a6a-11eb-9f1b-ec795f7ffe70.png)

As such, metrics such as LCP are calculated incorrectly.

#### What is the expected behavior?

Correctly render the list of products for the mobile version. The Google Mobile-Friendly Test and the Search Console live test render the page correctly. Here's the MFT screenshot:

![lh-expected](https://user-images.githubusercontent.com/8843352/111910670-05e59d80-8a6b-11eb-90d1-a442b3c1a925.png)

#### Environment Information
* Affected Channels: Chrome LH, PSI
* Chrome version: 89.0.4389.90 (Official Build) (64-bit) (cohort: Stable)
* Operating System: Windows 10 OS Version 2009 (Build 19042.867)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.