Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

misc(viewer): support 3.x and legacy (2.x) reports in viewer #5204

Merged
merged 8 commits into from
May 16, 2018

Conversation

paulirish
Copy link
Member

@paulirish paulirish commented May 14, 2018

Basic setup:

  1. The 2.x viewer is published to https://googlechrome.github.io/lighthouse/viewer2x/
  2. The 3.x viewer will live at https://googlechrome.github.io/lighthouse/viewer/ (but doesn't yet)
  3. User opens report in 3.x viewer app (via however: drag, paste, click menu item)
  4. The 3.x viewer app notices report isn't v3 and opens another tab with viewer2x/ and has it render the report.
  5. The 3.x viewer attempts to close it's own tab (but this doesn't always work (because user gestures?))
  6. The 3.x viewer tells the user what's happening with some toaster notifications.

Screencast:

2xviewr

This also relies on a few commits added to 2.x branch: branch2.x...viewer2x-deploy

fixes #5170

Copy link
Collaborator

@patrickhulce patrickhulce left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

overall approach is super slick! I like it 👍

if (messageEvent.data.opened) {
popup.postMessage({lhresults: json}, VIEWER_ORIGIN);
window.removeEventListener('message', msgHandler);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this because we need to listen for the render message to close? will this cause duplicate handler problems if they click "Open in viewer" twice?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

good question. @ebidel is that the situation this is handling?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I remember one issue is if you open viewer from a report, then use viewer as a viewer (looking at other reports or something), if you refresh it will send back an opened message back to the original report and load the first report, not whatever you've been doing since.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think what @brendankenny described is the sitch. Although I'm not sure why Chrome does that, but you sometimes get another message event when the page refreshes.

const viewerPath = '/lighthouse/viewer2x/';

logger.log(warnMsg, false);
features.sendJsonReport(json, viewerPath, onMessage);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

impl is a bit confusing that we create a temporary instance of the ViewerUIfeatures to trigger the render in viewer, feels a bit hacky

I think it's mostly just the fake flexibility of sendJsonReport that confuses me. WDYT of making this a bit more explicit with a sendJsonReportToV2 or something that both sure the same underlying logic?

they could just resolve a promise when they get confirmation that the report has been rendered and nix the onMessage piece

@paulirish paulirish temporarily deployed to PR staging May 14, 2018 19:30 Destroyed
Copy link
Member

@brendankenny brendankenny left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

generally this looks workable, I'm just wondering if we want another twist of hard-to-follow postMessaging passing through various inheritance levels :)

If we really want to do it right it feels like we should be bundling the report generator, loading the v3 bundle by default, and then loading the v2 bundle if the report is older. Then it should be pretty isolated to _replaceReportHtml(), where it'll just have to be calls to new bundle.DOM(), new bundle.ReportRenderer, and new bundle.ViewerUIFeatures() (or pull the init code into the bundle) and everything else is pretty much just saving/loading reports to pass into the versioned bundle

@paulirish
Copy link
Member Author

If we really want to do it right it feels like we should be bundling the report generator, loading the v3 bundle by default, and then loading the v2 bundle if the report is older. Then it should be pretty isolated to _replaceReportHtml(), where it'll just have to be calls to new bundle.DOM(), new bundle.ReportRenderer, and new bundle.ViewerUIFeatures() (or pull the init code into the bundle) and everything else is pretty much just saving/loading reports to pass into the versioned bundle

I tried this but it's real nasty. See https://github.com/GoogleChrome/lighthouse/compare/viewer2x-open-versioned-samedpage and branch2.x...viewer2x-deploy-versioned

removeEvtListener restored.

we good here?

Copy link
Collaborator

@patrickhulce patrickhulce left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm good with this 👍 I don't think viewer is high priority enough to warrant a huge investment to rewrite right now

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Viewer: support lhr v3.0
4 participants