feat(page): add color-gamut support to Page.emulateMediaFeatures

The change updates the validation function to allow color-gamut media
features and updates the documentation.

Issues: #6761

docs/api.md

@@ -1411,7 +1411,7 @@ List of all available devices is available in the source code: [src/common/Devic
 
 #### page.emulateMediaFeatures(features)
 - `features` <?[Array]<[Object]>> Given an array of media feature objects, emulates CSS media features on the page. Each media feature object must have the following properties:
-  - `name` <[string]> The CSS media feature name. Supported names are `'prefers-colors-scheme'`, `'prefers-reduced-motion'` and `'color-gamut'`.
+  - `name` <[string]> The CSS media feature name. Supported names are `'prefers-colors-scheme'`, `'prefers-reduced-motion'`, and `'color-gamut'`.
   - `value` <[string]> The value for the given CSS media feature.
 - returns: <[Promise]>
 
@@ -1444,11 +1444,11 @@ await page.evaluate(() => matchMedia('(prefers-reduced-motion: no-preference)').
 await page.emulateMediaFeatures([
   { name: 'color-gamut', value: 'p3' },
 ]);
-await page.evaluate(() => matchMedia('(color-gamu: srgb)').matches);
+await page.evaluate(() => matchMedia('(color-gamut: srgb)').matches);
 // → true
-await page.evaluate(() => matchMedia('(color-gamu: p3)').matches);
+await page.evaluate(() => matchMedia('(color-gamut: p3)').matches);
 // → true
-await page.evaluate(() => matchMedia('(color-gamu: rec2020)').matches);
+await page.evaluate(() => matchMedia('(color-gamut: rec2020)').matches);
 // → false
 ```
 

src/common/Page.ts

@@ -1387,7 +1387,9 @@ export class Page extends EventEmitter {
       features.every((mediaFeature) => {
         const name = mediaFeature.name;
         assert(
-          /^(prefers-(?:color-scheme|reduced-motion)|color-gamut)$/.test(name),
+          /^(?:prefers-(?:color-scheme|reduced-motion)|color-gamut)$/.test(
+            name
+          ),
           'Unsupported media feature: ' + name
         );
         return true;

test/emulation.spec.ts

@@ -252,9 +252,7 @@ describe('Emulation', () => {
       expect(
         await page.evaluate(() => matchMedia('(color-gamut: rec2020)').matches)
       ).toBe(false);
-      await page.emulateMediaFeatures([
-        { name: 'color-gamut', value: 'p3' },
-      ]);
+      await page.emulateMediaFeatures([{ name: 'color-gamut', value: 'p3' }]);
       expect(
         await page.evaluate(() => matchMedia('(color-gamut: p3)').matches)
       ).toBe(true);