feat(watchify): update to version 3.11 (#42600)

- refine `poll` configuration option type
- add `close` method
- add event supports
- update configuration to recommended one
- apply DT code format

https://github.com/browserify/watchify#methods

Thanks!

types/watchify/index.d.ts

@@ -1,48 +1,87 @@
-// Type definitions for watchify v3.7.0
+// Type definitions for watchify 3.11
 // Project: https://github.com/substack/watchify
 // Definitions by: TeamworkGuy2 <https://github.com/TeamworkGuy2>
+//                 Piotr Błażejewicz <https://github.com/peterblazejewicz>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
 
-import Browserify = require("browserify");
+import Browserify = require('browserify');
+
+declare module 'browserify' {
+    interface BrowserifyObject extends NodeJS.EventEmitter {
+        /**
+         * When the bundle changes, emit the array of bundle ids that changed.
+         */
+        on(event: 'update', listener: (ids: string[]) => any): this;
+        /**
+         * When a bundle is generated, this event fires with the number of bytes
+         */
+        on(event: 'bytes', listener: (bytes: number) => any): this;
+        /**
+         * When a bundle is generated, this event fires with the time it took to create the bundle in milliseconds.
+         */
+        on(event: 'time', listener: (time: number) => any): this;
+        /**
+         * This event fires after a bundle was created with messages of the form:
+         * ```text
+         * X bytes written (Y seconds)
+         * ```
+         * with the number of bytes in the bundle X and the time in seconds Y.
+         */
+        on(event: 'log', listener: (msg: string) => any): this;
+    }
+}
 
 declare var Watchify: Watchify.Constructor;
 
-/** Watch mode for browserify builds.
+/**
+ * Watch mode for browserify builds.
  * Update any source file and your browserify bundle will be recompiled on the spot
  */
 declare namespace Watchify {
-
-    /** Watch mode for browserify builds.
+    /**
+     * Watch mode for browserify builds.
      * Update any source file and your browserify bundle will be recompiled on the spot
      */
-    export interface Constructor {
-        args: { cache: any; packageCache: any; };
+    interface Constructor {
+        args: { cache: any; packageCache: any };
 
-        <T extends Browserify.BrowserifyObject>(b: T, opts?: Watchify.Options): T;
-        (b: Browserify.BrowserifyObject, opts?: Watchify.Options): Browserify.BrowserifyObject;
+        <T extends Browserify.BrowserifyObject>(b: T, opts?: Options): T;
+        (b: Browserify.BrowserifyObject, opts?: Options): Browserify.BrowserifyObject;
+
+        /** Close all the open watch handles. */
+        close(): void;
     }
 
-
-    export interface Options {
-        /** The amount of time in milliseconds to wait before emitting an "update" event after a change.
-         * Default: 100
+    interface Options {
+        /**
+         * The amount of time in milliseconds to wait before emitting an "update" event after a change.
+         * @default 100
          */
         delay?: number;
 
-        /** Ignores monitoring files for changes. If set to true, then ** /node_modules/ ** will be ignored. For other possible values see Chokidar's documentation on "ignored"
+        /**
+         * Ignores monitoring files for changes. If set to `true`, then ** /node_modules/ ** will be ignored.
+         * For other possible values see Chokidar's documentation on "ignored"
          * Also see anymatch package: https://github.com/es128/anymatch#usage
          */
-        ignoreWatch?: boolean | (string | RegExp | ((...values: any[]) => boolean) | (string | RegExp | ((...values: any[]) => boolean))[]);
+        ignoreWatch?:
+            | boolean
+            | (
+                  | string
+                  | RegExp
+                  | ((...values: any[]) => boolean)
+                  | Array<string | RegExp | ((...values: any[]) => boolean)>
+              );
 
-        /** Enables polling to monitor for changes. If set to true, then a polling interval of 100 ms is used.
+        /**
+         * Enables polling to monitor for changes. If set to `true`, then a polling interval of 100 ms is used.
          * If set to a number, then that amount of milliseconds will be the polling interval. For more info see
          * Chokidar's documentation on "usePolling" and "interval".
          * This option is useful if you're watching an NFS volume
          * Also see chokidar package: https://github.com/paulmillr/chokidar#path-filtering
          */
-        poll?: number;
+        poll?: boolean | number;
     }
-
 }
 
 export = Watchify;

types/watchify/tsconfig.json

@@ -6,7 +6,7 @@
         ],
         "noImplicitAny": true,
         "noImplicitThis": true,
-        "strictNullChecks": false,
+        "strictNullChecks": true,
         "strictFunctionTypes": true,
         "baseUrl": "../",
         "typeRoots": [
@@ -20,4 +20,4 @@
         "index.d.ts",
         "watchify-tests.ts"
     ]
-}
+}

types/watchify/tslint.json

@@ -1,24 +1 @@
-{
-    "extends": "dtslint/dt.json",
-    "rules": {
-        "array-type": false,
-        "callable-types": false,
-        "dt-header": false,
-        "eofline": false,
-        "export-just-namespace": false,
-        "jsdoc-format": false,
-        "no-consecutive-blank-lines": false,
-        "no-duplicate-variable": false,
-        "no-internal-module": false,
-        "no-namespace": false,
-        "no-padding": false,
-        "no-redundant-jsdoc": false,
-        "no-unnecessary-qualifier": false,
-        "no-var-keyword": false,
-        "only-arrow-functions": false,
-        "prefer-const": false,
-        "prefer-method-signature": false,
-        "space-before-function-paren": false,
-        "strict-export-declare-modifiers": false
-    }
-}
+{ "extends": "dtslint/dt.json" }

types/watchify/watchify-tests.ts

@@ -1,31 +1,46 @@
-import browserify = require("browserify");
-import watchify = require("watchify");
+import browserify = require('browserify');
+import watchify = require('watchify');
+import fs = require('fs');
 
-module WatchifyTest {
+const setupWatchifyTest = (srcPath: string, opts: watchify.Options, stream: NodeJS.ReadWriteStream) => {
+    // new syntax
+    let bfyWatched = browserify(srcPath, {
+        cache: watchify.args.cache,
+        packageCache: watchify.args.packageCache,
+        plugin: [watchify],
+    });
 
-    export function setupWatchify(srcPath: string, opts?: watchify.Options) {
-        // new syntax
-        var bfyWatched = browserify(srcPath, {
-            cache: watchify.args.cache,
-            packageCache: watchify.args.packageCache,
-            plugin: [watchify],
-        });
+    bfyWatched.pipeline.get('deps').push(stream);
 
-        var stream: NodeJS.ReadWriteStream;
-        bfyWatched.pipeline.get("deps").push(stream);
+    // old syntax
+    const bfy = browserify(srcPath);
 
-        // old syntax
-        var bfy = browserify(srcPath);
+    bfyWatched = watchify(bfy, {
+        delay: opts.delay || 100,
+        ignoreWatch: opts.ignoreWatch || false,
+        poll: opts.poll || 0,
+    });
 
-        var bfyWatched = watchify(bfy, {
-            delay: opts.delay || 100,
-            ignoreWatch: opts.ignoreWatch || false,
-            poll: opts.poll || 0,
-        });
+    bfy.pipeline.get('wrap').on('error', () => {});
+};
 
-        bfy.pipeline.get('wrap').on("error", function () { });
-    }
+const b = browserify({
+    entries: ['path/to/entry.js'],
+    cache: {},
+    packageCache: {},
+    plugin: [watchify],
+});
 
+b.on('update', bundle);
+b.on('update', ids => {});
+b.on('bytes', bytes => {});
+b.on('time', time => {});
+b.on('log', msg => {});
+
+bundle();
+
+function bundle() {
+    b.bundle()
+        .on('error', console.error)
+        .pipe(fs.createWriteStream('output.js'));
 }
-
-export = WatchifyTest;