From a4c506993563e05ab1a1dd40f7042131ecc57588 Mon Sep 17 00:00:00 2001 From: Jonathan Meyer <26874831+atmgrifter00@users.noreply.github.com> Date: Fri, 8 Mar 2024 16:03:37 -0600 Subject: [PATCH] Add select testing entry point, and use pageObject in test. --- .../select/testing/ng-package.json | 6 ++++++ .../select/testing/public-api.ts | 1 + .../select/testing/select.pageobject.ts | 0 ...t-control-value-accessor.directive.spec.ts | 19 +++++++++++-------- .../ni/nimble-angular/src/public-api.ts | 1 - 5 files changed, 18 insertions(+), 9 deletions(-) create mode 100644 angular-workspace/projects/ni/nimble-angular/select/testing/ng-package.json create mode 100644 angular-workspace/projects/ni/nimble-angular/select/testing/public-api.ts rename angular-workspace/projects/ni/nimble-angular/{src/directives => }/select/testing/select.pageobject.ts (100%) diff --git a/angular-workspace/projects/ni/nimble-angular/select/testing/ng-package.json b/angular-workspace/projects/ni/nimble-angular/select/testing/ng-package.json new file mode 100644 index 0000000000..e5440110fb --- /dev/null +++ b/angular-workspace/projects/ni/nimble-angular/select/testing/ng-package.json @@ -0,0 +1,6 @@ +{ + "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json", + "lib": { + "entryFile": "public-api.ts" + } +} \ No newline at end of file diff --git a/angular-workspace/projects/ni/nimble-angular/select/testing/public-api.ts b/angular-workspace/projects/ni/nimble-angular/select/testing/public-api.ts new file mode 100644 index 0000000000..5d27bfa639 --- /dev/null +++ b/angular-workspace/projects/ni/nimble-angular/select/testing/public-api.ts @@ -0,0 +1 @@ +export * from './select.pageobject'; \ No newline at end of file diff --git a/angular-workspace/projects/ni/nimble-angular/src/directives/select/testing/select.pageobject.ts b/angular-workspace/projects/ni/nimble-angular/select/testing/select.pageobject.ts similarity index 100% rename from angular-workspace/projects/ni/nimble-angular/src/directives/select/testing/select.pageobject.ts rename to angular-workspace/projects/ni/nimble-angular/select/testing/select.pageobject.ts diff --git a/angular-workspace/projects/ni/nimble-angular/src/directives/select/tests/nimble-select-control-value-accessor.directive.spec.ts b/angular-workspace/projects/ni/nimble-angular/src/directives/select/tests/nimble-select-control-value-accessor.directive.spec.ts index d6dd37ddf2..250ec6d45c 100644 --- a/angular-workspace/projects/ni/nimble-angular/src/directives/select/tests/nimble-select-control-value-accessor.directive.spec.ts +++ b/angular-workspace/projects/ni/nimble-angular/src/directives/select/tests/nimble-select-control-value-accessor.directive.spec.ts @@ -1,16 +1,12 @@ import { Component, ElementRef, Input, OnChanges, OnInit, SimpleChange, SimpleChanges, ViewChild } from '@angular/core'; import { ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing'; import { AbstractControl, FormControl, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms'; +import { SelectPageObject } from '@ni/nimble-angular/select/testing'; import { NimbleSelectModule } from '../nimble-select.module'; import { NimbleListOptionModule } from '../../list-option/nimble-list-option.module'; import { processUpdates, waitForUpdatesAsync } from '../../../testing/async-helpers'; import type { Select } from '../nimble-select.directive'; -function setSelectValue(select: Select, index: number): void { - select.dispatchEvent(new Event('click')); - select.options[index].dispatchEvent(new Event('click', { bubbles: true })); -} - describe('Nimble select control value accessor', () => { describe('when using option\'s [ngValue] binding', () => { @Component({ @@ -46,6 +42,7 @@ describe('Nimble select control value accessor', () => { let select: Select; let fixture: ComponentFixture; let testHostComponent: TestHostComponent; + let pageObject: SelectPageObject; beforeEach(() => { TestBed.configureTestingModule({ @@ -58,6 +55,7 @@ describe('Nimble select control value accessor', () => { fixture = TestBed.createComponent(TestHostComponent); testHostComponent = fixture.componentInstance; select = testHostComponent.select.nativeElement; + pageObject = new SelectPageObject(select); fixture.detectChanges(); // wait for select's 'options' property to be updated from slotted content await waitForUpdatesAsync(); @@ -81,7 +79,8 @@ describe('Nimble select control value accessor', () => { })); it('updates bound property when selected value is changed', () => { - setSelectValue(select, 2); + pageObject.clickSelect(); + pageObject.clickOption(2); fixture.detectChanges(); expect(testHostComponent.selectedOption).toBe(testHostComponent.selectOptions[2]); @@ -110,7 +109,8 @@ describe('Nimble select control value accessor', () => { it('fires ngModelChange one time with expected value', () => { const ngModelChangeSpy = spyOn(testHostComponent, 'onModelValueChange'); const indexToSelect = 2; - setSelectValue(select, indexToSelect); + pageObject.clickSelect(); + pageObject.clickOption(indexToSelect); fixture.detectChanges(); expect(ngModelChangeSpy).toHaveBeenCalledOnceWith(testHostComponent.selectOptions[indexToSelect]); }); @@ -142,6 +142,7 @@ describe('Nimble select control value accessor', () => { let select: Select; let fixture: ComponentFixture; let testHostComponent: TestHostComponent; + let pageObject: SelectPageObject; beforeEach(() => { TestBed.configureTestingModule({ @@ -154,6 +155,7 @@ describe('Nimble select control value accessor', () => { fixture = TestBed.createComponent(TestHostComponent); testHostComponent = fixture.componentInstance; select = testHostComponent.select.nativeElement; + pageObject = new SelectPageObject(select); fixture.detectChanges(); // wait for select's 'options' property to be updated from slotted content await waitForUpdatesAsync(); @@ -177,7 +179,8 @@ describe('Nimble select control value accessor', () => { })); it('updates bound property when selected value is changed', () => { - setSelectValue(select, 2); + pageObject.clickSelect(); + pageObject.clickOption(2); fixture.detectChanges(); expect(testHostComponent.selectedOption).toBe(testHostComponent.selectOptions[2].value.toString()); diff --git a/angular-workspace/projects/ni/nimble-angular/src/public-api.ts b/angular-workspace/projects/ni/nimble-angular/src/public-api.ts index 2a718399ec..19440ad0e1 100644 --- a/angular-workspace/projects/ni/nimble-angular/src/public-api.ts +++ b/angular-workspace/projects/ni/nimble-angular/src/public-api.ts @@ -67,7 +67,6 @@ export * from './directives/radio-group/nimble-radio-group.directive'; export * from './directives/radio-group/nimble-radio-group.module'; export * from './directives/select/nimble-select-control-value-accessor.directive'; export * from './directives/select/nimble-select.directive'; -export * from './directives/select/testing/select.pageobject'; export * from './directives/select/nimble-select.module'; export * from './directives/spinner/nimble-spinner.directive'; export * from './directives/spinner/nimble-spinner.module';