feat(TypeScript): move DeviceDescriptors to TS (#5595)

This commit moves `src/DeviceDescriptors` to be authored in TypeScript. This file was chosen due to its simplicity so that we can focus on getting a mixed JS/TS codebase playing nicely before migrating the more complex files.

The file itself was a bit odd: although the array of devices was exported via `module.exports` that was never referenced by any consumers; each device was also exported via `module.exports[name] = device` and that is how it's consumed. The Puppeteer docs suggest using it like so:

```js
puppeteer.devices['iPhone 6']
```

So instead of exporting the array and then setting a bunch of properties on that, we instead define the array and export an object of keys where each key is a device. This is a breaking change (see the footer for details).

Rather than export an object I'd much rather export a Map, but that would be a larger breaking change and I'm keen to avoid those for the time being.

Note that we have to use special TypeScript specific syntax for the export that enables it to work in a CommonJS codebase [1] but again I'd rather this than move to ESM at this time. TypeScript still outputs CommonJS into `lib/` as you would expect.

BREAKING CHANGE: We no longer export an array of devices, so any users relying on doing:

```js
puppeter.devices.forEach(...)
```

…will now see a breakage. The fix is to use `Object.{keys/entries/values}` to iterate instead.

[1]: https://www.typescriptlang.org/docs/handbook/modules.html#export--and-import--require

src/DeviceDescriptors.ts

@@ -14,7 +14,20 @@
  * limitations under the License.
  */
 
-module.exports = [
+interface Device {
+  name: string;
+  userAgent: string;
+  viewport: {
+    width: number;
+    height: number;
+    deviceScaleFactor: number;
+    isMobile: boolean;
+    hasTouch: boolean;
+    isLandscape: boolean;
+  };
+};
+
+const devices: Device[] = [
   {
     'name': 'Blackberry PlayBook',
     'userAgent': 'Mozilla/5.0 (PlayBook; U; RIM Tablet OS 2.1.0; en-US) AppleWebKit/536.2+ (KHTML like Gecko) Version/7.2.1.0 Safari/536.2+',
@@ -868,5 +881,15 @@ module.exports = [
     }
   }
 ];
-for (const device of module.exports)
+
-  module.exports[device.name] = device;
+type DevicesMap = {
+  [name: string]: Device;
+};
+
+const devicesMap: DevicesMap = {};
+
+for (const device of devices) {
+  devicesMap[device.name] = device;
+}
+
+export = devicesMap;

tsconfig.json

@@ -4,7 +4,8 @@
     "checkJs": true,
     "outDir": "./lib",
     "target": "ESNext",
-    "moduleResolution": "node"
+    "moduleResolution": "node",
+    "module": "CommonJS"
   },
   "include": [
     "src"

utils/doclint/cli.js

@@ -36,31 +36,29 @@ async function run() {
   let changedFiles = false;
 
   // Documentation checks.
-  {
+  const readme = await Source.readFile(path.join(PROJECT_DIR, 'README.md'));
-    const readme = await Source.readFile(path.join(PROJECT_DIR, 'README.md'));
+  const contributing = await Source.readFile(path.join(PROJECT_DIR, 'CONTRIBUTING.md'));
-    const contributing = await Source.readFile(path.join(PROJECT_DIR, 'CONTRIBUTING.md'));
+  const api = await Source.readFile(path.join(PROJECT_DIR, 'docs', 'api.md'));
-    const api = await Source.readFile(path.join(PROJECT_DIR, 'docs', 'api.md'));
+  const troubleshooting = await Source.readFile(path.join(PROJECT_DIR, 'docs', 'troubleshooting.md'));
-    const troubleshooting = await Source.readFile(path.join(PROJECT_DIR, 'docs', 'troubleshooting.md'));
+  const mdSources = [readme, api, troubleshooting, contributing];
-    const mdSources = [readme, api, troubleshooting, contributing];
 
-    const preprocessor = require('./preprocessor');
+  const preprocessor = require('./preprocessor');
-    messages.push(...await preprocessor.runCommands(mdSources, VERSION));
+  messages.push(...await preprocessor.runCommands(mdSources, VERSION));
-    messages.push(...await preprocessor.ensureReleasedAPILinks([readme], VERSION));
+  messages.push(...await preprocessor.ensureReleasedAPILinks([readme], VERSION));
 
-    const browser = await puppeteer.launch();
+  const browser = await puppeteer.launch();
-    const page = await browser.newPage();
+  const page = await browser.newPage();
-    const checkPublicAPI = require('./check_public_api');
+  const checkPublicAPI = require('./check_public_api');
-    const jsSources = await Source.readdir(path.join(PROJECT_DIR, 'lib'));
+  const jsSources = await Source.readdir(path.join(PROJECT_DIR, 'lib'));
-    messages.push(...await checkPublicAPI(page, mdSources, jsSources));
+  messages.push(...await checkPublicAPI(page, mdSources, jsSources));
 
-    await browser.close();
+  await browser.close();
 
-    for (const source of mdSources) {
+  for (const source of mdSources) {
-      if (!source.hasUpdatedText())
+    if (!source.hasUpdatedText())
-        continue;
+      continue;
-      await source.save();
+    await source.save();
-      changedFiles = true;
+    changedFiles = true;
-    }
   }
 
   // Report results.