From 049ee9d039940692ea84eed9c8d7f1390924e6c5 Mon Sep 17 00:00:00 2001 From: Osvaldo Pina Date: Wed, 3 Apr 2019 21:19:16 -0300 Subject: [PATCH] solving https://stackoverflow.com/questions/55483191/getting-error-in-angular-application-in-a-chrome-plugin --- .vscode/launch.json | 29 ++++ debug.log | 1 + generate-zip.js | 10 +- package.json | 74 ++++----- projects/chrome-plugin/src/app/manifest.json | 2 +- projects/chrome-plugin/src/main.ts | 3 +- projects/chrome-plugin/src/polyfills.ts | 2 +- .../src/lib/hal-render.component.ts | 6 +- .../tree-model/src/lib/tree-model.spec.ts | 142 +++++++++++++----- projects/tree-model/src/lib/tree-model.ts | 53 +++++-- .../uri-template-editor/src/public_api.ts | 1 + src/polyfills.ts | 1 + tsconfig.json | 3 + 13 files changed, 226 insertions(+), 101 deletions(-) create mode 100644 .vscode/launch.json create mode 100644 debug.log diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..9f41ded --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,29 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "chrome", + "request": "launch", + "name": "Launch Chrome against localhost", + "url": "http://localhost:4200", + "webRoot": "${workspaceFolder}" + }, + { + "name": "ng test", + "type": "chrome", + "request": "launch", + "url": "http://localhost:9876/debug.html", + "webRoot": "${workspaceFolder}", + "sourceMaps": true, + "sourceMapPathOverrides": { + "/./*": "${webRoot}/*", + "/src/*": "${webRoot}/*", + "/*": "*", + "/./~/*": "${webRoot}/node_modules/*" + } + } + ] +} diff --git a/debug.log b/debug.log new file mode 100644 index 0000000..0f4d3c8 --- /dev/null +++ b/debug.log @@ -0,0 +1 @@ +[0402/120603.422:ERROR:crash_report_database_win.cc(569)] CreateDirectory C:\Users\DEINF~1.OSV\AppData\Local\Temp\karma-97167760\Crashpad: O sistema não pode encontrar o caminho especificado. (0x3) diff --git a/generate-zip.js b/generate-zip.js index 47b68b8..d4315de 100644 --- a/generate-zip.js +++ b/generate-zip.js @@ -1,6 +1,10 @@ var zipFolder = require('zip-folder'); -zipFolder('./dist/chrome-plugin', './dist/hal-chrome-plugin.zip', function(err) { - console.log('Could not generate extension zip! ' + err); - process.exit('-1'); +zipFolder('./dist/chrome-plugin', './dist/hal-chrome-plugin.zip', function (err) { + if (err) { + console.log('Could not generate extension zip! ', err); + process.exit('-1'); + } else { + console.log('Extension zip generated successfully!'); + } }); diff --git a/package.json b/package.json index 79d5e13..dcc40a0 100644 --- a/package.json +++ b/package.json @@ -1,11 +1,12 @@ { "name": "hal-render-component", - "version": "0.0.1", + "version": "0.0.4", "scripts": { "ng": "ng", "start": "ng serve", "build-all-libraries": "ng build tree-model && ng build uri-template-editor && ng build hal-render-component", - "build": "npm run test && npm run build-all-libraries && ng build chrome-plugin --prod --output-hashing none && copyfiles -f projects/chrome-plugin/src/app/manifest.json dist/chrome-plugin", + "build": "npm run build-all-libraries && ng build chrome-plugin && copyfiles -f projects/chrome-plugin/src/app/manifest.json dist/chrome-plugin", + "build_": "npm run test && npm run build-all-libraries && ng build chrome-plugin && copyfiles -f projects/chrome-plugin/src/app/manifest.json dist/chrome-plugin", "postbuild": "node ./adjust-manifest-version.js && node ./generate-zip.js", "build-chrome-plugin": "ng build chrome-plugin --main projects/chrome-plugin/src/main.ts && copyfiles -f projects/chrome-plugin/src/app/manifest.json projects/chrome-plugin/src/app/icon.png dist/chrome-plugin", "test": "ng test tree-model --watch=false && ng test uri-template-editor --watch=false", @@ -14,47 +15,48 @@ }, "private": true, "dependencies": { - "@angular/animations": "~7.1.0", - "@angular/common": "~7.1.0", - "@angular/compiler": "~7.1.0", - "@angular/core": "~7.1.0", - "@angular/forms": "~7.1.0", - "@angular/platform-browser": "~7.1.0", - "@angular/platform-browser-dynamic": "~7.1.0", - "@angular/router": "~7.1.0", - "core-js": "^2.5.4", - "rxjs": "~6.3.3", - "tslib": "^1.9.0", + "@angular/animations": "~7.2.11", + "@angular/common": "~7.2.11", + "@angular/compiler": "~7.2.11", + "@angular/core": "~7.2.11", + "@angular/forms": "~7.2.11", + "@angular/platform-browser": "~7.2.11", + "@angular/platform-browser-dynamic": "~7.2.11", + "@angular/router": "~7.2.11", + "@webcomponents/custom-elements": "^1.2.2", + "core-js": "^3.0.0", + "rxjs": "~6.4.0", + "tslib": "^1.9.3", "urijs": "^1.19.1", - "zone.js": "^0.8.16" + "zone.js": "^0.9.0" }, "devDependencies": { - "@angular-devkit/build-angular": "~0.11.0", - "@angular-devkit/build-ng-packagr": "~0.11.0", - "@angular/cli": "~7.1.4", - "@angular/compiler-cli": "~7.1.0", - "@angular/language-service": "~7.1.0", - "@types/chrome": "0.0.60", - "@types/jasmine": "~2.8.8", - "@types/jasminewd2": "~2.0.3", - "@types/node": "^8.9.5", - "codelyzer": "~4.5.0", + "@angular-devkit/build-angular": "~0.13.7", + "@angular-devkit/build-ng-packagr": "~0.13.7", + "@angular/cli": "~7.3.7", + "@angular/compiler-cli": "~7.2.11", + "@angular/language-service": "~7.2.11", + "@types/chrome": "0.0.81", + "@types/jasmine": "~3.3.12", + "@types/jasminewd2": "~2.0.6", + "@types/node": "^11.13.0", + "codelyzer": "~5.0.0", "copyfiles": "^2.1.0", - "jasmine-core": "~2.99.1", + "jasmine-core": "~3.3.0", "jasmine-spec-reporter": "~4.2.1", - "karma": "~3.1.1", + "karma": "~4.0.1", "karma-chrome-launcher": "~2.2.0", - "karma-coverage-istanbul-reporter": "~2.0.1", - "karma-jasmine": "~1.1.2", - "karma-jasmine-html-reporter": "^0.2.2", - "ng-packagr": "^4.2.0", - "protractor": "~5.4.0", + "karma-coverage-istanbul-reporter": "~2.0.5", + "karma-jasmine": "~2.0.1", + "karma-jasmine-html-reporter": "^1.4.0", + "ng-packagr": "^5.0.1", + "protractor": "~5.4.2", "replace-in-file": "^3.4.4", - "ts-node": "~7.0.0", - "tsickle": ">=0.29.0", - "tslib": "^1.9.0", - "tslint": "~5.11.0", - "typescript": "~3.1.6", + "ts-node": "~8.0.3", + "tsickle": ">=0.34.3", + "tslib": "^1.9.3", + "tslint": "~5.15.0", + "typescript": "^3.2.4", "zip-folder": "^1.0.0" } } diff --git a/projects/chrome-plugin/src/app/manifest.json b/projects/chrome-plugin/src/app/manifest.json index 6e11ab7..6317fcd 100644 --- a/projects/chrome-plugin/src/app/manifest.json +++ b/projects/chrome-plugin/src/app/manifest.json @@ -11,7 +11,7 @@ "64": "assets/hal_64.png" }, "content_scripts": [ - { "matches": [""], "js": ["main.js", "polyfills.js", "runtime.js"], "run_at": "document_start" } + { "matches": [""], "js": ["main.js", "polyfills.js", "runtime.js", "vendor.js"], "run_at": "document_start" } ], "permissions":["*://*/*", ""] } diff --git a/projects/chrome-plugin/src/main.ts b/projects/chrome-plugin/src/main.ts index be9244f..6b96e84 100644 --- a/projects/chrome-plugin/src/main.ts +++ b/projects/chrome-plugin/src/main.ts @@ -1,5 +1,6 @@ -import 'core-js/es6/reflect'; +// import 'core-js/es6/reflect'; import 'core-js/es7/reflect'; +import 'zone.js/dist/zone'; import { enableProdMode } from '@angular/core'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; diff --git a/projects/chrome-plugin/src/polyfills.ts b/projects/chrome-plugin/src/polyfills.ts index afe4cd5..b803d13 100644 --- a/projects/chrome-plugin/src/polyfills.ts +++ b/projects/chrome-plugin/src/polyfills.ts @@ -77,9 +77,9 @@ /*************************************************************************************************** * Zone JS is required by default for Angular itself. */ +import '@webcomponents/custom-elements'; // Custom Elements Polyfill import 'zone.js/dist/zone'; // Included with Angular CLI. import 'core-js/es7/reflect'; - /*************************************************************************************************** * APPLICATION IMPORTS */ diff --git a/projects/hal-render-component/src/lib/hal-render.component.ts b/projects/hal-render-component/src/lib/hal-render.component.ts index 6e3e33a..56a744e 100644 --- a/projects/hal-render-component/src/lib/hal-render.component.ts +++ b/projects/hal-render-component/src/lib/hal-render.component.ts @@ -1,5 +1,5 @@ import { Component, Input } from '@angular/core'; -import { buildHalJsonTree, JsonElementNode } from 'tree-model'; +import { buildHalJsonTree, JsonElementNode, Curies } from 'tree-model'; enum CurrentView { RAW, @@ -24,7 +24,7 @@ export class HalRenderComponent { if (value && value.length > 0) { this.json = value; - this.root = buildHalJsonTree(JSON.parse(value)); + this.root = buildHalJsonTree(JSON.parse(value), new Curies(), true); this.expandAll(); } } @@ -59,10 +59,8 @@ export class HalRenderComponent { public versionFromChromeManifest() { if (chrome && chrome.runtime && chrome.runtime.getManifest) { - console.log('buscarndo do manifest'); return chrome.runtime.getManifest().version; } else { - console.log('buscarndo FORA do manifest'); return '(not running as chrome plugin!)'; } } diff --git a/projects/tree-model/src/lib/tree-model.spec.ts b/projects/tree-model/src/lib/tree-model.spec.ts index 7f36e5e..86762e2 100644 --- a/projects/tree-model/src/lib/tree-model.spec.ts +++ b/projects/tree-model/src/lib/tree-model.spec.ts @@ -11,7 +11,8 @@ import { buildHalJsonTree, buildHalEmbeddedJsonTree, getCurieName, - Curie + Curie, + Curies } from './tree-model'; describe('buildJsonTree', () => { @@ -314,8 +315,19 @@ describe('buildHalEmbeddedJsonTree', () => { ], false) ); }); - it('buildHalEmbeddedJsonTree for an array links rel ', () => { - + it('buildHalEmbeddedJsonTree for an array _embedded rel', () => { + console.log(buildHalEmbeddedJsonTree({ + '_embedded': { + 'first-rel': [ + { + 'first-property': 'first property value' + }, + { + 'second-property': 'second property value' + } + ] + } + })); expect( buildHalEmbeddedJsonTree({ '_embedded': { @@ -341,6 +353,54 @@ describe('buildHalEmbeddedJsonTree', () => { ], true), ], false)); }); + it('buildHalEmbeddedJsonTree for embedded array with _links', () => { + expect( + buildHalEmbeddedJsonTree({ + '_embedded': { + 'rel': [{ + '_links': { + 'self': { 'href': '/orders/123' } + } + }] + } + }) + ).toEqual( + + jsonNodeElementFactory('_embedded', JsonElementType.Object, null, [ + halNodeElementFactory('rel', JsonElementType.Array, HalElementType.LinkRel, null, [ + jsonNodeElementFactory(null, JsonElementType.Object, null, [ + jsonNodeElementFactory('_links', JsonElementType.Object, null, [ + halNodeElementFactory('self', JsonElementType.Object, HalElementType.LinkRel, null, [ + halNodeElementFactory('href', JsonElementType.String, HalElementType.LinkHref, '/orders/123', [], true) + ], true) + ], true), + ], true), + ], true), + ], false)); + }); + it('buildHalEmbeddedJsonTree for embedded object with _links', () => { + expect( + buildHalEmbeddedJsonTree({ + '_embedded': { + 'rel': { + '_links': { + 'self': { 'href': '/orders/123' } + } + } + } + }) + ).toEqual( + + jsonNodeElementFactory('_embedded', JsonElementType.Object, null, [ + halNodeElementFactory('rel', JsonElementType.Object, HalElementType.LinkRel, null, [ + jsonNodeElementFactory('_links', JsonElementType.Object, null, [ + halNodeElementFactory('self', JsonElementType.Object, HalElementType.LinkRel, null, [ + halNodeElementFactory('href', JsonElementType.String, HalElementType.LinkHref, '/orders/123', [], true) + ], true) + ], true), + ], true), + ], false)); + }); }); describe('buildHalJsonTree', () => { it('buildHalJsonTree for an complete hal object', () => { @@ -388,46 +448,48 @@ describe('buildHalJsonTree', () => { 'a-sub-object': { 'a-sub-object-property': 'a sub object property value' } - }) - ).toEqual( - jsonNodeElementFactory('root', JsonElementType.Root, null, [ - jsonNodeElementFactory('string-property', JsonElementType.String, 'string property value', [], false), - jsonNodeElementFactory('boolean-property', JsonElementType.Boolean, 'true', [], false), - jsonNodeElementFactory('array-property', JsonElementType.Array, null, [ - jsonNodeElementFactory(null, JsonElementType.String, 'first-array-item', [], false), - jsonNodeElementFactory(null, JsonElementType.Boolean, 'false', [], false), - jsonNodeElementFactory(null, JsonElementType.Number, '123', [], true), - ], false), - jsonNodeElementFactory('a-sub-object', JsonElementType.Object, null, [ - jsonNodeElementFactory('a-sub-object-property', JsonElementType.String, 'a sub object property value', [], true), - ], false), - jsonNodeElementFactory('_links', JsonElementType.Object, null, [ - halNodeElementFactory('curie-name:curie-parameter', JsonElementType.Object, HalElementType.LinkRel, null, [ - halNodeElementFactory('href', JsonElementType.String, HalElementType.LinkHref, 'http://self-url', [], true) - ], false, new Curie('curie-name', 'http://curie-href', true)), - halNodeElementFactory('an-array-link-rel', JsonElementType.Array, HalElementType.LinkRel, null, [ - jsonNodeElementFactory(null, JsonElementType.Object, null, [ - halNodeElementFactory('href', JsonElementType.String, HalElementType.LinkHref, 'http://one-array-link-rel-url', [], true) - ], false), - jsonNodeElementFactory(null, JsonElementType.Object, null, [ - halNodeElementFactory('href', JsonElementType.String, HalElementType.LinkHref, 'http://other-array-link-rel-url', [], true) + }, + new Curies(), + true) + ).toEqual( + jsonNodeElementFactory('root', JsonElementType.Root, null, [ + jsonNodeElementFactory('string-property', JsonElementType.String, 'string property value', [], false), + jsonNodeElementFactory('boolean-property', JsonElementType.Boolean, 'true', [], false), + jsonNodeElementFactory('array-property', JsonElementType.Array, null, [ + jsonNodeElementFactory(null, JsonElementType.String, 'first-array-item', [], false), + jsonNodeElementFactory(null, JsonElementType.Boolean, 'false', [], false), + jsonNodeElementFactory(null, JsonElementType.Number, '123', [], true), + ], false), + jsonNodeElementFactory('a-sub-object', JsonElementType.Object, null, [ + jsonNodeElementFactory('a-sub-object-property', JsonElementType.String, 'a sub object property value', [], true), + ], false), + jsonNodeElementFactory('_links', JsonElementType.Object, null, [ + halNodeElementFactory('curie-name:curie-parameter', JsonElementType.Object, HalElementType.LinkRel, null, [ + halNodeElementFactory('href', JsonElementType.String, HalElementType.LinkHref, 'http://self-url', [], true) + ], false, new Curie('curie-name', 'http://curie-href', true)), + halNodeElementFactory('an-array-link-rel', JsonElementType.Array, HalElementType.LinkRel, null, [ + jsonNodeElementFactory(null, JsonElementType.Object, null, [ + halNodeElementFactory('href', JsonElementType.String, HalElementType.LinkHref, 'http://one-array-link-rel-url', [], true) + ], false), + jsonNodeElementFactory(null, JsonElementType.Object, null, [ + halNodeElementFactory('href', JsonElementType.String, HalElementType.LinkHref, 'http://other-array-link-rel-url', [], true) + ], true) ], true) - ], true) - ], false), - jsonNodeElementFactory('_embedded', JsonElementType.Object, null, [ - halNodeElementFactory('a-embedded-rel', JsonElementType.Object, HalElementType.LinkRel, null, [ - jsonNodeElementFactory('a-property', JsonElementType.String, 'a property value', [], true), ], false), - halNodeElementFactory('curie-name:other-embedded-rel', JsonElementType.Array, HalElementType.LinkRel, null, [ - jsonNodeElementFactory(null, JsonElementType.Object, null, [ - jsonNodeElementFactory('first-property', JsonElementType.String, 'first property value', [], true) + jsonNodeElementFactory('_embedded', JsonElementType.Object, null, [ + halNodeElementFactory('a-embedded-rel', JsonElementType.Object, HalElementType.LinkRel, null, [ + jsonNodeElementFactory('a-property', JsonElementType.String, 'a property value', [], true), ], false), - jsonNodeElementFactory(null, JsonElementType.Object, null, [ - jsonNodeElementFactory('second-property', JsonElementType.String, 'second property value', [], true) - ], true), - ], true, new Curie('curie-name', 'http://curie-href', true)) - ], true) - ], true)); + halNodeElementFactory('curie-name:other-embedded-rel', JsonElementType.Array, HalElementType.LinkRel, null, [ + jsonNodeElementFactory(null, JsonElementType.Object, null, [ + jsonNodeElementFactory('first-property', JsonElementType.String, 'first property value', [], true) + ], false), + jsonNodeElementFactory(null, JsonElementType.Object, null, [ + jsonNodeElementFactory('second-property', JsonElementType.String, 'second property value', [], true) + ], true), + ], true, new Curie('curie-name', 'http://curie-href', true)) + ], true) + ], true)); }); }); describe('isCuriedRel', () => { diff --git a/projects/tree-model/src/lib/tree-model.ts b/projects/tree-model/src/lib/tree-model.ts index b2a023b..c02ed3d 100644 --- a/projects/tree-model/src/lib/tree-model.ts +++ b/projects/tree-model/src/lib/tree-model.ts @@ -34,27 +34,39 @@ export class Curie { } export class Curies { - curies: Curie[] = []; + curiesArray: Curie[] = []; add(curie: Curie) { - this.curies.push(curie); + this.curiesArray.push(curie); } getCuriesNames() { - return this.curies.reduce((acum, curie, i) => { + return this.curiesArray.reduce((acum, curie, i) => { return acum + (i === 0 ? '' : ', ') + curie.name; }, ''); } get(name: string) { - for (let i = 0; i <= this.curies.length - 1; i++) { - if (this.curies[i].name === name) { - return this.curies[i]; + for (let i = 0; i <= this.curiesArray.length - 1; i++) { + if (this.curiesArray[i].name === name) { + return this.curiesArray[i]; } } throw new Error(`Could not find curie named ${name}. availabe curies are: ${this.getCuriesNames()}`); } + merge(curies: Curies): Curies { + let mergedCuriesArray: Curie[]; + if (curies === null) { + mergedCuriesArray = curies.curiesArray.slice(0); + } else { + mergedCuriesArray = this.curiesArray.concat(curies.curiesArray); + } + const mergedCuries = new Curies(); + mergedCuries.curiesArray = mergedCuriesArray; + return mergedCuries; + } + } @@ -90,28 +102,37 @@ export function halNodeElementFactory(name: string, type: JsonElementType, halEl return result; } -export function buildJsonTree(value: any): JsonElementNode { - return buildJsonNode(value, true, 'root'); +export function buildJsonTree(value: any, isRoot = true): JsonElementNode { + return buildJsonNode(value, true, isRoot ? 'root' : null); } -export function buildHalJsonTree(value: object): JsonElementNode { +export function buildHalJsonTree(value: object, curiesBase: Curies, isRoot: boolean): JsonElementNode { const _links = value['_links']; const _embedded = value['_embedded']; delete value['_links']; delete value['_embedded']; - const resourceTree = buildJsonTree(value); + const resourceTree = buildJsonTree(value, isRoot); - resourceTree.type = JsonElementType.Root; + if (isRoot) { + resourceTree.type = JsonElementType.Root; + } else { + resourceTree.type = JsonElementType.Object; + } if (resourceTree.children.length > 0) { resourceTree.children[resourceTree.children.length - 1].lastItem = false; } + let curies; + if (_links) { curies = extractCuries(_links); + if (curiesBase) { + curies = curiesBase.merge(curies); + } - delete _links['curies']; + // delete _links['curies']; resourceTree.children.push(buildHalLinksJsonTree({ '_links': _links }, curies)); @@ -196,11 +217,13 @@ export function buildHalEmbeddedJsonTree(links: object, curies: Curies = new Cur } embeddedRoot.children.push(embeddedRelArray); embeddedRels[embeddedRel].forEach((embeddedItem) => { - embeddedRelArray.children.push(buildJsonNode(embeddedItem, false)); + const embeddedItemTreeItem = buildHalJsonTree(embeddedItem, curies, false); + embeddedItemTreeItem.lastItem = false; + embeddedRelArray.children.push(embeddedItemTreeItem); }); embeddedRelArray.children[embeddedRelArray.children.length - 1].lastItem = true; } else if (typeof embeddedRels[embeddedRel] === 'object') { - const embeddedResourceTree = buildHalJsonTree(embeddedRels[embeddedRel]); + const embeddedResourceTree = buildHalJsonTree(embeddedRels[embeddedRel], curies, false); if (curieName) { embeddedResourceTree.curie = curies.get(curieName); } @@ -258,7 +281,7 @@ function buildJsonNode(value: any, last: boolean, name = null): JsonElementNode node.expanded = false; - if (value == null) { + if (value == null) { node.type = JsonElementType.Null; } else if (typeof value === 'string') { node.type = JsonElementType.String; diff --git a/projects/uri-template-editor/src/public_api.ts b/projects/uri-template-editor/src/public_api.ts index 0394cdb..9cccce0 100644 --- a/projects/uri-template-editor/src/public_api.ts +++ b/projects/uri-template-editor/src/public_api.ts @@ -3,3 +3,4 @@ */ export * from './lib/uri-template-editor.module'; + diff --git a/src/polyfills.ts b/src/polyfills.ts index a6d34ea..7e94cdc 100644 --- a/src/polyfills.ts +++ b/src/polyfills.ts @@ -78,6 +78,7 @@ * Zone JS is required by default for Angular itself. */ import 'zone.js/dist/zone'; // Included with Angular CLI. +import 'core-js/es7/reflect'; /*************************************************************************************************** diff --git a/tsconfig.json b/tsconfig.json index 81650c5..54b9a78 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -19,6 +19,9 @@ "dom" ], "paths": { + "core-js/es7/reflect": [ + "node_modules/core-js/proposals/reflect-metadata" + ], "hal-render-component": [ "dist/hal-render-component" ],