feat: adding port customiztion and re-launch for watch

Author: misterbrownlee

README.md

@@ -335,15 +335,19 @@ The following tasks are available:
 
 - `gulp build` - Performs a build of all components and the top level package
 - `gulp buildComponents` - Performs a build of all components
-- `gulp dev` - Performs a lite build (custom properties only), opens your browser with the documentation site, then starts watching components and website files
+- `gulp dev` - Performs a lite build (custom properties only), runs browsersync and serves the documentation on the default port (3000), then starts watching components and website files
 - `gulp clean` - Cleans all output files for the project and all components
-- `gulp watch` - Assuming a build has already been performed, immediately opens your browser with the documentation site, then starts watching components and website files
+- `gulp watch` - Assuming a build has already been performed, re-starts starts watching components and website files. Presumes a browser is already open to your locally served docs
+- `gulp watch-relaunch` - Restarts watch and opens a new browser for the docs URL
 - `gulp buildCombined` - Builds the combined output files (`dist/spectrum-*.css`)
 - `gulp buildStandalone` - Builds the standalone output files (`dist/standalone/spectrum-*.css`)
 - `gulp release` - Performs a release of the top-level package
 - `gulp packageLint` - Lint the `package.json` file for each component in the monorepo
 - `gulp readmeLint` - Generate a generic `README.md` file for each component in the monorepo
 
+Note: `yarn run dev` will run `gulp dev` above but trigger browsersync to open the documentation URL. You can set `BROWSERSYNC_OPEN=true` to change dev and watch to always open the URL.
+
+You can set a new port for `watch` by setting `BROWSERSYNC_PORT=<port number>`, e.g. `export BROWSERSYNC_PORT=9000; gulp watch` to set the port to `9000`.
 
 
 ## Testing

gulpfile.js

@@ -215,6 +215,11 @@ exports.devHeavy = gulp.series(
   exports.devHeavy
 );
 
+exports['watch-relaunch'] = function() {
+  process.env['BROWSERSYNC_OPEN'] = true;
+  exports.watch();
+}
+
 exports.buildDocs = builder.buildDocs;
 
 exports.releaseBundles = releaseBundles;

tools/bundle-builder/dev/index.js

@@ -14,17 +14,26 @@ const gulp = require('gulp');
 const logger = require('gulplog');
 const browserSync = require('browser-sync');
 const path = require('path');
-const dirs = require('../lib/dirs')
+const dirs = require('../lib/dirs');
 
 const docs = require('../docs');
 const subrunner = require('../subrunner');
 
 function serve() {
+
+  let PORT = 3000;
+
+  if (process.env.BROWSERSYNC_PORT) {
+    PORT = process.env.BROWSERSYNC_PORT;
+    logger.info(`Setting '${PORT} as port for browsersync, which hopefully is valid`);
+  }
+
   browserSync({
     startPath: 'docs/index.html',
     server: `${process.cwd()}/dist/`,
     notify: process.env.BROWSERSYNC_NOTIFY === 'true' ? true : false,
-    open: process.env.BROWSERSYNC_OPEN === 'true' ? true : false
+    open: process.env.BROWSERSYNC_OPEN === 'true' ? true : false,
+    port: PORT
   });
 }
 

yarn.lock

@@ -1447,10 +1447,10 @@
   resolved "https://registry.yarnpkg.com/@spectrum-css/radio/-/radio-3.0.24.tgz#7a08476edf42be2007b75f7765c18c26eb3a9880"
   integrity sha512-C/saSKXb3dNCWprsP4iXkFFEmRrxwsdm2Al04myZ6pxOJ4tr1WjHAAtorwUgaUiyR87OnL1mGX2aWrFEN1mvtQ==
 
-"@spectrum-css/spectrum-css-vr-test-assets-essential@^1.0.45":
-  version "1.0.45"
-  resolved "https://registry.yarnpkg.com/@spectrum-css/spectrum-css-vr-test-assets-essential/-/spectrum-css-vr-test-assets-essential-1.0.45.tgz#a850e194fb7cb3044d5a58b611728fcb174aab31"
-  integrity sha512-tJHCHTrR8De/SQfJGQ5qh8OYZd2t1pFj7xr5DPey+tDdYw3NAHDGO+MHMBZQfthsEs18jJIcNsxWr+Jg5dR5vQ==
+"@spectrum-css/spectrum-css-vr-test-assets-essential@^1.0.46":
+  version "1.0.46"
+  resolved "https://registry.yarnpkg.com/@spectrum-css/spectrum-css-vr-test-assets-essential/-/spectrum-css-vr-test-assets-essential-1.0.46.tgz#8a8c9007003f5c7c1501b3a0ecb721f751f9f68b"
+  integrity sha512-09KcehdKIxpVTxmC3bkaCGiLwbxakFNZIirGQlwryu0qnuu1uzst+ELnZdh0s/O2akfmo43PRbaKiIL0x23NQg==
 
 "@szmarczak/http-timer@^1.1.2":
   version "1.1.2"