Revamp Percy setup

[matthiasrohmer]

Currently the site uses Percy to test PRs for visual changes and potential diffs they introduce. The current config only checks a small subset of hardcoded pages or rather page types:

https://github.com/GoogleChrome/developer.chrome.com/blob/6be350b9a675c68aa22ec7daf6403abf20163ed3/.percy.js#L1-L9

A Percy run on those URLs is performed for every commit that changes a file with those extensions:

https://github.com/GoogleChrome/developer.chrome.com/blob/6be350b9a675c68aa22ec7daf6403abf20163ed3/.github/workflows/percy.yml#L8-L12

This approach is not ideal, as changes affecting the UI might not be reflected in the tested URLs or unapproved snapshots might trigger false-positives. To improve the situation we want to do the following

• [ ] Identify all types of pages (templates) and create an elaborate example page for all of those templates, using all supported components for that type
• [ ] Create a new test case (snapshot) for each of those new example pages
• [ ] Create example pages using all variations of every component, both layout and prose components while also checking the shortcode implementations to verify all features are documented
• [ ] Create snapshots for component example pages
• [ ] Improve when Percy tests are actually run. Ideally only run when visual changes are likely, instead of every commit