Feature/fix local dev workflow

examples/cli-example/README.md

@@ -10,7 +10,7 @@ npm i
 
 Run `npm run playground:build` to replace the installed angular-playground with the development version.
 
-`npm run playground` accesses `node_modules/angular-playground/dist/bin/index.js` directory, so changes
+`npm run playground` accesses the local version of angular-playground, so changes
 within the CLI will require `npm run playground:build` to be run before changes will appear.
 ```
 npm run playground:build && npm run playground

examples/cli-example/package.json

@@ -9,9 +9,9 @@
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e",
-    "playground": "node ./node_modules/angular-playground/dist/bin/index.js",
-    "playground:prod": "node ./node_modules/angular-playground/dist/bin/index.js --build",
-    "playground:check-errors": "node ./node_modules/angular-playground/dist/bin/index.js --check-errors",
+    "playground": "angular-playground",
+    "playground:prod": "angular-playground --build",
+    "playground:check-errors": "angular-playground --check-errors",
     "playground:build": "(cd ../../ && sh ./scripts/build.sh)"
   },
   "private": true,
@@ -32,7 +32,7 @@
   },
   "devDependencies": {
     "@angular/compiler-cli": "^6.0.0",
-    "@angular-devkit/build-angular": "~0.6.0",
+    "@angular-devkit/build-angular": "~0.7.4",
     "typescript": "~2.7.2",
     "@angular/cli": "~6.0.0",
     "@angular/language-service": "^6.0.0",
@@ -42,12 +42,12 @@
     "codelyzer": "~4.2.1",
     "jasmine-core": "~2.99.1",
     "jasmine-spec-reporter": "~4.2.1",
-    "karma": "~1.7.1",
+    "karma": "~3.0.0",
     "karma-chrome-launcher": "~2.2.0",
     "karma-coverage-istanbul-reporter": "~1.4.2",
     "karma-jasmine": "~1.1.1",
     "karma-jasmine-html-reporter": "^0.2.2",
-    "protractor": "~5.3.0",
+    "protractor": "~5.4.0",
     "ts-node": "~5.0.1",
     "tslint": "~5.9.1"
   }

examples/cli-example/tsconfig.json

@@ -5,6 +5,7 @@
     "outDir": "./dist/out-tsc",
     "sourceMap": true,
     "declaration": false,
+    "module": "es2015",
     "moduleResolution": "node",
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
@@ -15,6 +16,11 @@
     "lib": [
       "es2017",
       "dom"
-    ]
+    ],
+    "paths": {
+      "@angular/*": [
+        "./node_modules/@angular/*"
+      ]
+    }
   }
 }

packages/angular-playground/CHANGELOG.md

@@ -1,16 +1,32 @@
+# 5.1.0 (2018-08-21)
+
+<a name="5.1.0"></a>
+
+### Features
+* **update sandbox config:** Add new `entryComponents` and `schemas` options for use when dynamically creating a module containing the dependencies of a `Sandbox` ([5f91c7f](https://github.com/SoCreate/angular-playground/commit/5f91c7f)).
+* **add cli schematics:** Add the ability to install `angular-playground` with `ng add`.
+* **add sandbox schematics:** Add the ability to create a new sandbox file with an ng cli command.
+
+### Bug Fixes
+* **natives package:** Updated `natives` npm package to fix gulp issue on windows running node 10+.
+* **local development:** Fixed several bugs with local development environment that caused the sandbox to crash when built and run locally.
+
+### Kudos
+* Thanks to **@sulco** for the contributions towards this release!
+
 # 5.0.1 (2018-05-31)
 
 <a name="5.0.1"></a>
 
 ### Bug Fixes
-* **fix sandbox file watch :** Fix issue with sandbox files not getting compiled when new one is added or removed 
+* **fix sandbox file watch:** Fix issue with sandbox files not getting compiled when new one is added or removed.
 
 # 5.0.0 (2018-05-18)
 
 <a name="5.0.0"></a>
 
 ### Features
-* **compatible with version 6 :** Updated Angular Playground to be work with Angular 6 and Angular CLI 6 
+* **compatible with version 6:** Updated Angular Playground to be work with Angular 6 and Angular CLI 6.
 
 ### Breaking Changes
 
@@ -126,7 +142,7 @@
 <a name="4.0.1"></a>
 
 ### Bug Fixes
-* **app:** Fixed issue with matching sandbox metadata when formatted differently. ([aa9285a](https://github.com/SoCreate/angular-playground/commit/aa9285a)).
+* **app:** Fixed issue with matching sandbox metadata when formatted differently ([aa9285a](https://github.com/SoCreate/angular-playground/commit/aa9285a)).
 
 # 4.0.0 (2018-03-15)
 
@@ -137,7 +153,7 @@
            modules to the Playground application. This is a feature that we're especially excited about at
            SoCreate and plan on extending the functionality further based on what type of plugins people would
            like to develop. Right now, the plugin system provides a wrapper around distributing modules to all
-           sandboxes globally and enabling a command-bar overlay. ([1db080f](https://github.com/SoCreate/angular-playground/commit/1db080f))
+           sandboxes globally and enabling a command-bar overlay ([1db080f](https://github.com/SoCreate/angular-playground/commit/1db080f))
 
   When declaring the Playground entry point in `main.playground.ts`, use `PlaygroundModule` to provide configuration:
   ```typescript
@@ -194,7 +210,7 @@
   ```
 
 * **app:** Added an opt-in overlay that allows users to open the command bar via click/touch. To enable this, use the
-        `PlaygroundModule.configure({ overlay: true })` option (see above for code example). ([f047453](https://github.com/SoCreate/angular-playground/commit/f047453))
+        `PlaygroundModule.configure({ overlay: true })` option (see above for code example) ([f047453](https://github.com/SoCreate/angular-playground/commit/f047453)).
 * **cli:** Added base-href support for production builds. This works in the same way as @angular/cli's `ng build --base-href` command does.
         Pass it in when running a build: ([0af9fbc](https://github.com/SoCreate/angular-playground/commit/0af9fbc))
   ```
@@ -206,7 +222,7 @@
 * **app:** Fixed IE11 command bar appearing on pages after being closed ([8e0f099](https://github.com/SoCreate/angular-playground/commit/8e0f099)).
 * **app:** Switched the "quick switch" key to `control` from `alt` for firefox compatibility
            ([8b5b386](https://github.com/SoCreate/angular-playground/commit/8b5b386)).
-* **cli:** Better error reporting due to properly surfacing errors and exiting the CLI process ([53692cc](https://github.com/SoCreate/angular-playground/commit/53692cc))
+* **cli:** Better error reporting due to properly surfacing errors and exiting the CLI process ([53692cc](https://github.com/SoCreate/angular-playground/commit/53692cc)).
 
 ### Kudos
 * Thanks to **@pharaxe**, **@cvidal**, and **@michaeljfuller** for their contributions towards this release!

packages/angular-playground/cli/src/build-angular-cli.ts

@@ -1,15 +1,13 @@
 import { exec } from 'child_process';
-import { join as joinPath } from 'path';
 
 export async function buildAngularCli(appName: string, baseHref: string) {
     let isInstalled = await serviceWorkerIsInstalled();
     if (!isInstalled) {
         throw new Error('\n\nError: --build requires @angular/service-worker to be installed locally: \n' +
-        `try running "npm install @angular/service-worker" then run "angular-playground --build" \n` +
-        'see docs: https://github.com/angular/angular-cli/wiki/build#service-worker \n\n');
+        'try running "npm install @angular/service-worker" then run "angular-playground --build" \n' +
+        'see docs: https://github.com/angular/angular-cli/wiki/build#service-worker\n\n');
     }
 
-
     console.log('Building for production with sandboxes...');
     // Cannot build w/ AOT due to runtime compiler dependency
     exec(`ng build ${appName} --prod --aot=false --base-href=${baseHref}`, (err, stdout, stderr) => {
@@ -21,11 +19,17 @@ export async function buildAngularCli(appName: string, baseHref: string) {
 async function serviceWorkerIsInstalled(): Promise<boolean> {
     return new Promise<boolean>((resolve, reject) => {
         try {
-            // Check package is installed locally
+            // Check package is installed (prod)
             require.resolve('@angular/service-worker');
             resolve(true);
         } catch (err) {
-            resolve(false);
+            try {
+                // Check package is installed (dev)
+                require.resolve('../../../../../examples/cli-example/node_modules/@angular/service-worker');
+                resolve(true);
+            } catch (err2) {
+                resolve(false);
+            }
         }
     });
 }

packages/angular-playground/core/src/app.component.ts

@@ -8,7 +8,7 @@ import { fuzzySearch } from './shared/fuzzy-search.function';
 import { LevenshteinDistance } from './shared/levenshtein-distance';
 import { SandboxLoader } from './shared/sandbox-loader';
 import { Middleware, MIDDLEWARE } from '../lib/middlewares';
-import { Observable, pipe } from 'rxjs';
+import { Observable } from 'rxjs';
 import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
 
 @Component({