fix generate ui & generate ui e2e

nrwl · Dec 12, 2024 · becb086 · becb086
1 parent 79ccb30
commit becb086
Show file tree

Hide file tree

Showing 14 changed files with 62 additions and 67 deletions.
diff --git a/apps/generate-ui-v2-e2e/tsconfig.json b/apps/generate-ui-v2-e2e/tsconfig.json
@@ -1,10 +1,8 @@
 {
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
-    "sourceMap": false,
-    "outDir": "../../dist/out-tsc",
-    "types": ["cypress", "node", "cypress-real-events"],
-    "moduleResolution": "node"
+    "outDir": "out-tsc/generate-ui-v2-e2e",
+    "types": ["cypress", "node", "cypress-real-events"]
   },
   "include": [
     "src/**/*.ts",

diff --git a/apps/generate-ui-v2/src/components/field-nav-item.ts b/apps/generate-ui-v2/src/components/field-nav-item.ts
@@ -6,7 +6,7 @@ import { FieldValueConsumer } from './field-value-consumer-mixin';
 @customElement('field-nav-item')
 export class FieldNavItem extends FieldValueConsumer(LitElement) {
   @property()
-  protected option: Option;
+  option: Option;
 
   @property()
   greyedOut = false;

diff --git a/apps/generate-ui-v2/src/components/field-value-consumer-mixin.ts b/apps/generate-ui-v2/src/components/field-value-consumer-mixin.ts
@@ -10,33 +10,33 @@ import { generatorContextContext } from '../contexts/generator-context-context';
 type Constructor<T> = new (...args: any[]) => T;
 
 export declare class FieldValueConsumerInterface {
-  protected option: Option;
-  protected validation: boolean | string | undefined;
-  protected touched: boolean;
-  protected isDefaultValue: boolean;
-  protected submitted: boolean;
-  protected generatorContext: GeneratorContext | undefined;
-  protected shouldRenderChanged(): boolean;
-  protected shouldRenderError(): boolean;
+  option: Option;
+  validation: boolean | string | undefined;
+  touched: boolean;
+  isDefaultValue: boolean;
+  submitted: boolean;
+  generatorContext: GeneratorContext | undefined;
+  shouldRenderChanged(): boolean;
+  shouldRenderError(): boolean;
 }
 
 export const FieldValueConsumer = <T extends Constructor<LitElement>>(
   superClass: T
 ) => {
   class FieldValueConsumerElement extends superClass {
-    protected option: Option;
+    option: Option;
 
     @state()
-    private validation: string | boolean | undefined;
+    validation: string | boolean | undefined;
 
     @state()
-    private touched = false;
+    touched = false;
 
     @state()
-    private isDefaultValue = true;
+    isDefaultValue = true;
 
     @state()
-    private submitted = false;
+    submitted = false;
 
     @state() generatorContext: GeneratorContext | undefined;
 
@@ -85,7 +85,7 @@ export const FieldValueConsumer = <T extends Constructor<LitElement>>(
       return this.touched && !this.isDefaultValue;
     }
 
-    protected createRenderRoot(): Element | ShadowRoot {
+    createRenderRoot(): Element | ShadowRoot {
       return this;
     }
   }

diff --git a/apps/generate-ui-v2/src/components/fields/array-field.ts b/apps/generate-ui-v2/src/components/fields/array-field.ts
@@ -98,9 +98,7 @@ export class ArrayField extends FieldWrapper(Field(LitElement)) {
     this.dispatchValue(this.elements);
   }
 
-  protected setFieldValue(
-    value: string | boolean | number | string[] | undefined
-  ) {
+  setFieldValue(value: string | boolean | number | string[] | undefined) {
     if (typeof value === 'string') {
       this.elements = value.split(',');
     } else if (Array.isArray(value)) {

diff --git a/apps/generate-ui-v2/src/components/fields/autocomplete/autocomplete-field.ts b/apps/generate-ui-v2/src/components/fields/autocomplete/autocomplete-field.ts
@@ -9,7 +9,7 @@ import { Combobox, ComboboxAutocomplete } from '@microsoft/fast-foundation';
 
 @customElement('autocomplete-field')
 export class AutocompleteField extends FieldWrapper(Field(LitElement)) {
-  protected renderField(): TemplateResult {
+  renderField(): TemplateResult {
     if (this.editor === 'vscode') {
       return this.renderVSCode();
     } else {
@@ -94,9 +94,7 @@ export class AutocompleteField extends FieldWrapper(Field(LitElement)) {
     this.dispatchValue(value);
   }
 
-  protected setFieldValue(
-    value: string | boolean | number | string[] | undefined
-  ) {
+  setFieldValue(value: string | boolean | number | string[] | undefined) {
     const selector =
       this.editor === 'vscode' ? 'vscode-combobox' : 'intellij-combobox';
     const autocompleteNode = this.renderRoot.querySelector(selector);

diff --git a/apps/generate-ui-v2/src/components/fields/checkbox-field.ts b/apps/generate-ui-v2/src/components/fields/checkbox-field.ts
@@ -30,9 +30,7 @@ export class CheckboxField extends CheckboxWrapper(Field(LitElement)) {
     }
   }
 
-  protected setFieldValue(
-    value: string | number | boolean | string[] | undefined
-  ): void {
+  setFieldValue(value: string | number | boolean | string[] | undefined): void {
     const inputElement = this.renderRoot.querySelector(
       this.editor === 'intellij' ? 'input' : 'vscode-checkbox'
     );

diff --git a/apps/generate-ui-v2/src/components/fields/input-field.ts b/apps/generate-ui-v2/src/components/fields/input-field.ts
@@ -13,7 +13,7 @@ import { FieldWrapper } from './mixins/field-wrapper-mixin';
 
 @customElement('input-field')
 export class InputField extends FieldWrapper(Field(LitElement)) {
-  protected renderField(): TemplateResult {
+  renderField(): TemplateResult {
     const error = this.shouldRenderError();
     if (this.editor === 'intellij') {
       return html`
@@ -44,9 +44,7 @@ export class InputField extends FieldWrapper(Field(LitElement)) {
     this.dispatchValue(value);
   }
 
-  protected setFieldValue(
-    value: string | boolean | number | string[] | undefined
-  ) {
+  setFieldValue(value: string | boolean | number | string[] | undefined) {
     const inputNode = this.renderRoot.querySelector(
       this.editor === 'intellij' ? 'input' : 'vscode-text-field'
     );

diff --git a/apps/generate-ui-v2/src/components/fields/mixins/checkbox-wrapper-mixin.ts b/apps/generate-ui-v2/src/components/fields/mixins/checkbox-wrapper-mixin.ts
@@ -13,7 +13,7 @@ export const CheckboxWrapper = <
   base: T
 ) => {
   return class extends base {
-    protected render() {
+    render() {
       return html`
         <div
           class="${this.shouldRenderError()

diff --git a/apps/generate-ui-v2/src/components/fields/mixins/field-mixin.ts b/apps/generate-ui-v2/src/components/fields/mixins/field-mixin.ts
@@ -25,27 +25,21 @@ export type OptionChangedDetails = {
 
 export declare class FieldInterface {
   option: Option;
-  protected renderField(): TemplateResult;
-  protected validation: boolean | string | undefined;
-  protected touched: boolean;
-  protected dispatchValue(
-    value: string | boolean | number | string[] | undefined
-  ): void;
-  protected setFieldValue(
-    value: string | boolean | number | string[] | undefined
-  ): void;
-  protected fieldId: string;
-  protected ariaAttributes: Record<string, string>;
+  renderField(): TemplateResult;
+  validation: boolean | string | undefined;
+  touched: boolean;
+  dispatchValue(value: string | boolean | number | string[] | undefined): void;
+  setFieldValue(value: string | boolean | number | string[] | undefined): void;
+  fieldId: string;
+  ariaAttributes: Record<string, string>;
 }
 
 export const Field = <T extends Constructor<LitElement>>(superClass: T) => {
   class FieldElement extends FieldValueConsumer(EditorContext(superClass)) {
     @property()
     option: Option;
 
-    protected dispatchValue(
-      value: string | boolean | number | string[] | undefined
-    ) {
+    dispatchValue(value: string | boolean | number | string[] | undefined) {
       const defaultValue = extractDefaultValue(this.option);
       const isDefaultValue = compareWithDefaultValue(value, defaultValue);
 
@@ -62,7 +56,7 @@ export const Field = <T extends Constructor<LitElement>>(superClass: T) => {
       );
     }
 
-    protected firstUpdated(
+    firstUpdated(
       _changedProperties: PropertyValueMap<unknown> | Map<PropertyKey, unknown>
     ): void {
       super.updated(_changedProperties);
@@ -87,11 +81,11 @@ export const Field = <T extends Constructor<LitElement>>(superClass: T) => {
       this.dispatchValue(undefined);
     }
 
-    protected get fieldId(): string {
+    get fieldId(): string {
       return `${this.option.name}-field`;
     }
 
-    protected get ariaAttributes(): Record<
+    get ariaAttributes(): Record<
       'id' | 'aria-invalid' | 'aria-describedby',
       string
     > {
@@ -101,19 +95,19 @@ export const Field = <T extends Constructor<LitElement>>(superClass: T) => {
         'aria-describedby': `${this.fieldId}-error`,
       };
     }
-    protected createRenderRoot(): Element | ShadowRoot {
+    createRenderRoot(): Element | ShadowRoot {
       return this;
     }
 
     // placeholders for subclasses
-    protected setFieldValue(
+    setFieldValue(
       // eslint-disable-next-line @typescript-eslint/no-unused-vars
       value: string | boolean | number | string[] | undefined
     ): void {
       throw new Error('Not implemented');
     }
 
-    protected renderField(): TemplateResult {
+    renderField(): TemplateResult {
       throw new Error('Not implemented');
     }
   }

diff --git a/apps/generate-ui-v2/src/components/fields/mixins/field-wrapper-mixin.ts b/apps/generate-ui-v2/src/components/fields/mixins/field-wrapper-mixin.ts
@@ -12,7 +12,7 @@ export const FieldWrapper = <
   base: T
 ) => {
   return class extends base {
-    protected render() {
+    render() {
       return html`
         <div
           class="${this.shouldRenderError()

diff --git a/apps/generate-ui-v2/src/components/fields/multiselect-field.ts b/apps/generate-ui-v2/src/components/fields/multiselect-field.ts
@@ -103,9 +103,7 @@ export class MultiselectField extends FieldWrapper(Field(LitElement)) {
     this.dispatchValue(this.selectedElements);
   }
 
-  protected setFieldValue(
-    value: string | number | boolean | string[] | undefined
-  ): void {
+  setFieldValue(value: string | number | boolean | string[] | undefined): void {
     let values: string[] = [];
     if (typeof value === 'string') {
       values = value.split(',');

diff --git a/apps/generate-ui-v2/src/components/fields/select-field.ts b/apps/generate-ui-v2/src/components/fields/select-field.ts
@@ -71,9 +71,7 @@ export class SelectField extends FieldWrapper(Field(LitElement)) {
     `;
   }
 
-  protected setFieldValue(
-    value: string | number | boolean | string[] | undefined
-  ): void {
+  setFieldValue(value: string | number | boolean | string[] | undefined): void {
     const selectNode = this.renderRoot.querySelector(
       this.editor === 'intellij' ? 'select' : 'vscode-dropdown'
     );
@@ -83,7 +81,7 @@ export class SelectField extends FieldWrapper(Field(LitElement)) {
     selectNode.value = value ? `${value}` : '';
   }
 
-  private handleChange(e: Event) {
+  handleChange(e: Event) {
     const value = (e.target as HTMLInputElement).value;
     this.dispatchValue(value);
   }

diff --git a/apps/generate-ui-v2/tsconfig.app.json b/apps/generate-ui-v2/tsconfig.app.json
@@ -1,10 +1,19 @@
 {
-  "extends": "./tsconfig.json",
+  "extends": "../../tsconfig.base.json",
   "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
+    "outDir": "out-tsc/generate-ui-v2",
     "module": "ESNext",
+    "moduleResolution": "bundler",
     "types": ["node"],
-    "useDefineForClassFields": false
+    "useDefineForClassFields": false,
+    "lib": ["DOM", "esnext.asynciterable"],
+    "experimentalDecorators": true,
+    "emitDecoratorMetadata": true,
+    "noImplicitOverride": false,
+    "noImplicitReturns": false,
+    "noUnusedLocals": false,
+    "isolatedModules": false,
+    "strict": false
   },
   "exclude": ["jest.config.ts", "src/**/*.spec.ts", "src/**/*.test.ts"],
   "include": ["src/**/*.ts"],

diff --git a/apps/generate-ui-v2/tsconfig.spec.json b/apps/generate-ui-v2/tsconfig.spec.json
@@ -1,14 +1,20 @@
 {
-  "extends": "./tsconfig.json",
+  "extends": "../../tsconfig.base.json",
   "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
+    "outDir": "out-tsc/jest",
     "module": "commonjs",
+    "moduleResolution": "node10",
     "types": ["jest", "node"]
   },
   "include": [
     "jest.config.ts",
     "src/**/*.test.ts",
     "src/**/*.spec.ts",
     "src/**/*.d.ts"
+  ],
+  "references": [
+    {
+      "path": "./tsconfig.app.json"
+    }
   ]
 }