Boost: Prevent display issues / crashes from leftover Critical CSS Error data

[thingalon]

Jetpack Boost 1.2.0 changes the way that Critical CSS errors are raised and stored, making them more consistent and appropriate for display in the new UI.

However, if there is old error data left in the database from a previous version, it can cause crashes or display issues in the current beta.

This PR fixes the issue by filtering out old Critical CSS failure information, instead showing a very generic error message for these cases:

This will only affect users who have previously had issues generating Critical CSS, and have since upgraded to 1.2.0. It will encourage them to try again, and they will then receive the updated error flow.

Changes proposed in this Pull Request:

• Filter out invalid Critical CSS error data, ensuring leftover old errors from previous versions do not cause crashes or display issues.

Does this pull request change what data or activity we track or use?

no

Testing instructions:

1. Install Jetpack Boost 1.1.1 on a test site.
2. Ensure that Critical CSS generation will fail by causing errors in core pages. (e.g.: 500 error on front page)
3. Attempt Critical CSS generation, leaving errors in the system.
4. Upgrade to 1.2.0 and try to view the Jetpack Boost dashboard.

It should not generate any PHP or JavaScript warnings. The dashboard should clearly show that Critical CSS generation was not successful last time, and encourage users to try again.

Also, importantly: Successful Critical CSS results should not be removed or affected when upgrading from 1.1.1 to 1.2.0.

[github-actions]

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

• ✅ Include a description of your PR changes.
  
• ✅ All commits were linted before commit.
  
• ✅ Add a "[Status]" label (In Progress, Needs Team Review, ...).
  
• ✅ Add testing instructions.
  
• ✅ Specify whether this PR includes any changes to data or privacy.
  
• ✅ Add changelog entries to affected projects
  

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

---

The e2e test report can be found here. Please note that it can take a few minutes after the e2e tests checks are complete for the report to be available.

---

Once your PR is ready for review, check one last time that all required checks (other than "Required review") appearing at the bottom of this PR are passing or skipped.
Then, add the "[Status] Needs Team review" label and ask someone from your team review the code.
Once you’ve done so, switch to the "[Status] Needs Review" label; someone from Jetpack Crew will then review this PR and merge it to be included in the next Jetpack release.

---

Boost plugin:

• Next scheduled release: September 7, 2021.
• Scheduled code freeze: August 30, 2021.

[davidlonjon]

Hi @thingalon,

It tooks me a while to test this (got to setup a test site and few other things to get a patch version of Boost) and the patch does stop having a display issue. However I have a difference in the UI after the patch for as shown in these 2 videos:

jetpack-boost-back-compatibility-fix-demo.mov

jetpack-boost-back-compatibility-fix-demo-1.mov

It might be that my test is not fully accurate. The first demo is where I put a redirection to the default hello world page. The second demo is when I forced an error on the homepage.

I am running out of time for today to look more into it. I'll make myself available tomorrow to see your feedback and to test the PR again if there are any changes to it.

[davidlonjon]

Following our discussion with on Slack, this is good to go.

[thingalon]

Adding @kraftbj and @jeherve as reviewers as a stop-gap until we get David able to approve Boost-specific PRs.

[thingalon]

Cherry-picked to boost/branch-1.2.0 in 2c63285.