diff --git a/.gitignore b/.gitignore index ce1d7bd5da..658b9f0e0e 100644 --- a/.gitignore +++ b/.gitignore @@ -13,4 +13,6 @@ stats.html !.vscode/settings.json .coveralls.yml -packages/examples-react/build \ No newline at end of file +packages/examples-react/build + +**/.angular/cache \ No newline at end of file diff --git a/package.json b/package.json index 6c194d5344..fb619c5771 100644 --- a/package.json +++ b/package.json @@ -1,13 +1,13 @@ { "name": "jsonforms-monorepo", "engines": { - "node": "^16.13", + "node": "^16.14", "pnpm": ">=7.13.4" }, "scripts": { "lerna": "lerna", "preparePublish": "git clean -dfx && pnpm i --frozen-lockfile && pnpm run clean && pnpm run build && pnpm run doc && pnpm run test", - "merge-report": "mkdir -p coverage && lcov-result-merger 'packages/**/coverage/lcov.info' 'coverage/lcov.info'", + "merge-report": "mkdir -p coverage && lcov-result-merger 'packages/**/coverage/lcov.info' 'coverage/lcov.info' --prepend-source-files", "check-format": "echo 'temporarily disabled'", "build": "lerna run build", "bundle": "lerna run bundle", diff --git a/packages/angular-material/.eslintrc.js b/packages/angular-material/.eslintrc.js index 399fcb2b71..1eef8aa523 100644 --- a/packages/angular-material/.eslintrc.js +++ b/packages/angular-material/.eslintrc.js @@ -33,5 +33,21 @@ module.exports = { caughtErrorsIgnorePattern: '^_', }, ], + // workaround for + // https://github.com/import-js/eslint-plugin-import/issues/1810: + "import/no-unresolved": [ + "error", + { + ignore: [ + "@angular/cdk/.*", + "@angular/core/.*", + "@angular/material/.*", + "@angular/platform-browser/.*", + "@angular/platform-browser-dynamic/.*", + "core-js/es7/.*", + "zone.js/.*", + ] + } + ], }, }; diff --git a/packages/angular-material/example/app/app.component.ts b/packages/angular-material/example/app/app.component.ts index a46055cc02..2a274a6145 100644 --- a/packages/angular-material/example/app/app.component.ts +++ b/packages/angular-material/example/app/app.component.ts @@ -74,7 +74,7 @@ const itemTester: UISchemaTester = (_schema, schemaPath, _path) => {
- Current locale: {{ currentLocale }} + Current locale: {{ i18n.locale }} @@ -85,19 +85,17 @@ const itemTester: UISchemaTester = (_schema, schemaPath, _path) => { [uischema]="selectedExample.uischema" [renderers]="renderers" [i18n]="i18n" - [uischemas]="uischemas" [readonly]="readonly" - [config]="config" > `, }) export class AppComponent { readonly renderers = angularMaterialRenderers; readonly examples = getExamples(); - selectedExample: ExampleDescription; + selectedExample: ExampleDescription | undefined; i18n: JsonFormsI18nState; private dateAdapter; - private readonly = false; + readonly = false; data: any; uischemas: { tester: UISchemaTester; uischema: UISchemaElement }[] = [ { tester: itemTester, uischema: uiSchema }, @@ -114,7 +112,7 @@ export class AppComponent { this.selectedExample = this.examples.find( (e) => e.name === ev.target.value ); - this.i18n = this.selectedExample.i18n ?? defaultI18n; + this.i18n = this.selectedExample?.i18n ?? defaultI18n; } changeLocale(locale: string) { diff --git a/packages/angular-material/karma.conf.js b/packages/angular-material/karma.conf.js new file mode 100644 index 0000000000..31077a040b --- /dev/null +++ b/packages/angular-material/karma.conf.js @@ -0,0 +1,54 @@ +// Karma configuration file, see link for more information +// https://karma-runner.github.io/1.0/config/configuration-file.html + +module.exports = function (config) { + config.set({ + basePath: '', + frameworks: ['jasmine', '@angular-devkit/build-angular'], + plugins: [ + require('karma-jasmine'), + require('karma-chrome-launcher'), + require('karma-jasmine-html-reporter'), + require('karma-coverage'), + require('@angular-devkit/build-angular/plugins/karma') + ], + client: { + jasmine: { + // you can add configuration options for Jasmine here + // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html + // for example, you can disable the random execution with `random: false` + // or set a specific seed with `seed: 4321` + }, + clearContext: false // leave Jasmine Spec Runner output visible in browser + }, + jasmineHtmlReporter: { + suppressAll: true // removes the duplicated traces + }, + coverageReporter: { + subdir: '.', + reporters: [ + { type: 'lcov' }, + { type: 'text-summary' } + ] + }, + reporters: ['progress', 'kjhtml', 'dots'], + + browsers: [ config.singleRun ? 'ChromeHeadlessNoSandbox' : 'Chrome' ], + customLaunchers: { + ChromeHeadlessNoSandbox: { + base: 'ChromeHeadless', + flags: ['--no-sandbox'], + }, + }, + restartOnFileChange: true, + logLevel: config.LOG_INFO, + + webpackMiddleware: { + stats: 'detailed', + }, + + webpackServer: { + noInfo: true, + }, + }); +}; diff --git a/packages/angular-material/package.json b/packages/angular-material/package.json index 85ea1e6ba4..7e4fde8c14 100644 --- a/packages/angular-material/package.json +++ b/packages/angular-material/package.json @@ -39,16 +39,17 @@ "typings": "./lib/esm/index.d.ts", "scripts": { "build": "ngc && ngc -p tsconfig.cjs.json", - "build:examples-app": "rollup -c rollup.example.config.js", - "dev": "webpack --config webpack/webpack.dev.js && webpack-dev-server --config webpack/webpack.dev.js --env=dev --inline", + "build:examples-app": "ngc -p tsconfig.example.json && rollup -c rollup.example.config.js", + "dev": "pnpm run build:examples-app && npx http-server ./example/dist/ -c-1 -o", "clean": "rimraf lib coverage dist .nyc_output 2> /dev/null", "lint": "eslint .", "lint:fix": "eslint --fix .", "report": "nyc report --reporter=html", "doc": "typedoc --name 'JSON Forms Angular Material Renderers' --out docs src", - "test": "karma start ./test-config/karma.conf.js --single-run", - "test-ci": "karma start ./test-config/karma.conf.js --single-run", - "test-cov": "karma start ./test-config/karma.conf.js --coverage --single-run", + "test-dbg": "node ./test-runner", + "test": "node ./test-runner --single-run", + "test-ci": "node ./test-runner --single-run", + "test-cov": "node ./test-runner --coverage --single-run", "e2e": "npm run e2e-update && npm run e2e-test", "e2e-test": "protractor ./test-config/protractor.conf.js", "e2e-update": "webdriver-manager update --standalone false --gecko false" @@ -60,78 +61,80 @@ ] }, "peerDependencies": { - "@angular/animations": "^12.0.0 || ^13.0.0 || ^14.0.0", - "@angular/cdk": "^12.0.0 || ^13.0.0 || ^14.0.0", - "@angular/common": "^12.0.0 || ^13.0.0 || ^14.0.0", - "@angular/core": "^12.0.0 || ^13.0.0 || ^14.0.0", - "@angular/flex-layout": "^12.0.0-beta || ^13.0.0-beta || ^14.0.0-beta", - "@angular/forms": "^12.0.0 || ^13.0.0 || ^14.0.0", - "@angular/material": "^12.0.0 || ^13.0.0 || ^14.0.0", - "@angular/platform-browser": "^12.0.0 || ^13.0.0 || ^14.0.0", - "@angular/router": "^12.0.0 || ^13.0.0 || ^14.0.0", + "@angular/animations": "^15.0.0", + "@angular/cdk": "^15.0.0", + "@angular/common": "^15.0.0", + "@angular/core": "^15.0.0", + "@angular/flex-layout": "^15.0.0-beta", + "@angular/forms": "^15.0.0", + "@angular/material": "^15.0.0", + "@angular/platform-browser": "^15.0.0", + "@angular/router": "^15.0.0", "@jsonforms/angular": "3.2.0-alpha.3", + "@jsonforms/angular-test": "^3.2.0-alpha.3", "@jsonforms/core": "3.2.0-alpha.3", - "core-js": "^2.5.3", - "rxjs": "^6.5.3 || ^7.4.0" + "rxjs": "^6.6.0 || ^7.4.0" }, "dependencies": { "hammerjs": "2.0.8", "lodash": "^4.17.21" }, "devDependencies": { - "@angular-eslint/eslint-plugin": "^12.0.0", - "@angular-eslint/eslint-plugin-template": "^12.0.0", - "@angular-eslint/schematics": "^12.0.0", - "@angular-eslint/template-parser": "^12.0.0", - "@angular/animations": "^12.0.0", - "@angular/cdk": "^12.0.0", - "@angular/common": "^12.0.0", - "@angular/compiler": "^12.0.0", - "@angular/compiler-cli": "^12.0.0", - "@angular/core": "^12.0.0", - "@angular/flex-layout": "^12.0.0-beta", - "@angular/forms": "^12.0.0", - "@angular/material": "^12.0.0", - "@angular/platform-browser": "^12.0.0", - "@angular/platform-browser-dynamic": "^12.0.0", - "@angular/router": "^12.0.0", + "@angular-devkit/build-angular": "~15.2.10", + "@angular-eslint/eslint-plugin": "^15.0.0", + "@angular-eslint/eslint-plugin-template": "^15.0.0", + "@angular-eslint/schematics": "^15.0.0", + "@angular-eslint/template-parser": "^15.0.0", + "@angular/animations": "^15.0.0", + "@angular/cdk": "^15.0.0", + "@angular/common": "^15.0.0", + "@angular/compiler": "^15.0.0", + "@angular/compiler-cli": "^15.0.0", + "@angular/core": "^15.0.0", + "@angular/flex-layout": "^15.0.0-beta", + "@angular/forms": "^15.0.0", + "@angular/material": "^15.0.0", + "@angular/platform-browser": "^15.0.0", + "@angular/platform-browser-dynamic": "^15.0.0", + "@angular/router": "^15.0.0", "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.5", "@babel/plugin-proposal-optional-chaining": "^7.16.5", "@jsonforms/angular": "workspace:*", "@jsonforms/angular-test": "workspace:*", "@jsonforms/core": "workspace:*", "@jsonforms/examples": "workspace:*", + "@ngtools/webpack": "^15.0.0", "@rollup/plugin-commonjs": "^23.0.3", "@rollup/plugin-json": "^5.0.2", "@rollup/plugin-node-resolve": "^15.0.1", "@rollup/plugin-replace": "^5.0.1", - "@types/node": "^16.18.34", + "@types/jasmine": "~3.8.0", + "@types/lodash": "4.14.149", + "@types/node": "^18.10.0", "@typescript-eslint/eslint-plugin": "^5.54.1", "@typescript-eslint/parser": "^5.54.1", - "angular2-template-loader": "^0.6.2", "babel-loader": "^8.0.6", - "copy-webpack-plugin": "^5.0.5", - "core-js": "^2.5.3", + "copy-webpack-plugin": "^11.0.0", "eslint": "^7.32.0", "eslint-config-prettier": "^8.7.0", "eslint-plugin-import": "^2.27.5", "eslint-plugin-prettier": "^4.2.1", "html-loader": "^0.5.5", - "istanbul-instrumenter-loader": "^3.0.1", + "http-server": "^14.1.1", "jasmine": "^3.99.0", "jasmine-spec-reporter": "^4.2.1", - "karma": "^3.1.4", + "karma": "^6.4.1", "karma-chrome-launcher": "^3.2.0", - "karma-coverage-istanbul-reporter": "^2.1.1", + "karma-coverage": "~2.0.3", "karma-jasmine": "^2.0.1", "karma-jasmine-html-reporter": "^1.7.0", "karma-sourcemap-loader": "^0.3.8", - "karma-webpack": "^4.0.2", + "karma-webpack": "^5.0.0", + "ng-packagr": "^15.0.0", "null-loader": "^0.1.1", "nyc": "^15.1.0", "prettier": "^2.8.4", - "protractor": "^5.4.1", - "request": "^2.88.0", + "protractor": "^7.0.0", "rimraf": "^3.0.2", "rollup": "^2.78.0", "rollup-plugin-cleanup": "^3.2.1", @@ -139,14 +142,13 @@ "rollup-plugin-import-css": "^3.3.1", "rollup-plugin-typescript2": "^0.34.1", "rollup-plugin-visualizer": "^5.4.1", - "rxjs": "^6.5.3", + "rxjs": "^6.6.0", "ts-loader": "^6.2.1", "tslib": "^2.5.0", - "typedoc": "~0.21.9", - "typescript": "4.2.3", - "webpack": "^4.41.2", - "webpack-cli": "^3.2.1", - "webpack-dev-server": "^3.9.0", + "typedoc": "~0.25.3", + "typescript": "~4.9.5", + "webpack": "^5.78.0", + "yargs": "^17.7.2", "zone.js": "^0.11.4" } } diff --git a/packages/angular-material/rollup.example.config.js b/packages/angular-material/rollup.example.config.js index e355cbd123..0a745fa032 100644 --- a/packages/angular-material/rollup.example.config.js +++ b/packages/angular-material/rollup.example.config.js @@ -10,7 +10,7 @@ import typescript from 'rollup-plugin-typescript2'; * @type {import('rollup').RollupOptions} */ const config = { - input: 'example/main.ts', + input: 'example/dist/example/main.js', output: { file: 'example/dist/bundle.js', format: 'iife', diff --git a/packages/angular-material/src/controls/autocomplete.renderer.ts b/packages/angular-material/src/controls/autocomplete.renderer.ts index 3af32412a7..b8db63089e 100644 --- a/packages/angular-material/src/controls/autocomplete.renderer.ts +++ b/packages/angular-material/src/controls/autocomplete.renderer.ts @@ -108,6 +108,7 @@ export class AutocompleteControlRenderer @Input() options: string[]; filteredOptions: Observable; shouldFilter: boolean; + focused = false; constructor(jsonformsService: JsonFormsAngularService) { super(jsonformsService); diff --git a/packages/angular-material/src/controls/date.renderer.ts b/packages/angular-material/src/controls/date.renderer.ts index 5d628a1717..ea708aa9b6 100644 --- a/packages/angular-material/src/controls/date.renderer.ts +++ b/packages/angular-material/src/controls/date.renderer.ts @@ -54,6 +54,8 @@ import { JsonFormsAngularService, JsonFormsControl } from '@jsonforms/angular'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class DateControlRenderer extends JsonFormsControl { + focused = false; + constructor(jsonformsService: JsonFormsAngularService) { super(jsonformsService); } diff --git a/packages/angular-material/src/controls/number.renderer.ts b/packages/angular-material/src/controls/number.renderer.ts index dddb0ff0bb..6efca50016 100644 --- a/packages/angular-material/src/controls/number.renderer.ts +++ b/packages/angular-material/src/controls/number.renderer.ts @@ -69,6 +69,7 @@ export class NumberControlRenderer extends JsonFormsControl { locale: string; numberFormat: Intl.NumberFormat; decimalSeparator: string; + focused = false; constructor(jsonformsService: JsonFormsAngularService) { super(jsonformsService); diff --git a/packages/angular-material/src/controls/range.renderer.ts b/packages/angular-material/src/controls/range.renderer.ts index 49a3979787..c55e08e206 100644 --- a/packages/angular-material/src/controls/range.renderer.ts +++ b/packages/angular-material/src/controls/range.renderer.ts @@ -38,16 +38,17 @@ import { isRangeControl, RankedTester, rankWith } from '@jsonforms/core'; label }} + showTickMarks + #ngSlider + > + + {{ description }} @@ -60,6 +61,7 @@ export class RangeControlRenderer extends JsonFormsControl { min: number; max: number; multipleOf: number; + focused = false; constructor( jsonformsService: JsonFormsAngularService, diff --git a/packages/angular-material/src/controls/text.renderer.ts b/packages/angular-material/src/controls/text.renderer.ts index 8659a64975..72a6335a43 100644 --- a/packages/angular-material/src/controls/text.renderer.ts +++ b/packages/angular-material/src/controls/text.renderer.ts @@ -49,6 +49,7 @@ import { isStringControl, RankedTester, rankWith } from '@jsonforms/core'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class TextControlRenderer extends JsonFormsControl { + focused = false; constructor(jsonformsService: JsonFormsAngularService) { super(jsonformsService); } diff --git a/packages/angular-material/src/controls/textarea.renderer.ts b/packages/angular-material/src/controls/textarea.renderer.ts index 073b1b3fe3..ae69996066 100644 --- a/packages/angular-material/src/controls/textarea.renderer.ts +++ b/packages/angular-material/src/controls/textarea.renderer.ts @@ -48,6 +48,7 @@ import { isMultiLineControl, RankedTester, rankWith } from '@jsonforms/core'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class TextAreaRenderer extends JsonFormsControl { + focused = false; constructor(jsonformsService: JsonFormsAngularService) { super(jsonformsService); } diff --git a/packages/angular-material/src/layouts/array-layout.renderer.ts b/packages/angular-material/src/layouts/array-layout.renderer.ts index da21164f07..f0800eff40 100644 --- a/packages/angular-material/src/layouts/array-layout.renderer.ts +++ b/packages/angular-material/src/layouts/array-layout.renderer.ts @@ -95,7 +95,7 @@ import { first as first " > - + diff --git a/packages/angular-material/src/layouts/group-layout.renderer.ts b/packages/angular-material/src/layouts/group-layout.renderer.ts index 291d5e8143..fed61ade38 100644 --- a/packages/angular-material/src/layouts/group-layout.renderer.ts +++ b/packages/angular-material/src/layouts/group-layout.renderer.ts @@ -34,8 +34,8 @@ import { JsonFormsAngularService } from '@jsonforms/angular'; @Component({ selector: 'GroupLayoutRenderer', template: ` - - {{ label }} + + {{ label }}
{{ label }} `, + template: ` `, }) export class LabelRenderer extends JsonFormsBaseRenderer diff --git a/packages/angular-material/src/other/master-detail/master.ts b/packages/angular-material/src/other/master-detail/master.ts index 3b47935c67..1e556269ea 100644 --- a/packages/angular-material/src/other/master-detail/master.ts +++ b/packages/angular-material/src/other/master-detail/master.ts @@ -86,7 +86,7 @@ export const removeSchemaKeywords = (path: string) => { {{ item.label || 'No label set' }}