fix(matchers): 🐛 add toHaveSelectedOptions matcher for jest (#271)

projects/spectator/jest/src/lib/matchers-types.d.ts

@@ -47,5 +47,7 @@ declare namespace jest {
  toHaveDescendant(selector: string | Element): boolean;
 
  toHaveDescendantWithText({ selector, text }: { selector: string; text: string }): boolean;
+
+ toHaveSelectedOptions(expected: string | string[] | HTMLOptionElement | HTMLOptionElement[]): boolean;
  }
 }

projects/spectator/jest/test/form-select/form-select.component.spec.ts

@@ -0,0 +1,21 @@
+import { ReactiveFormsModule } from '@angular/forms';
+import { Spectator, createComponentFactory } from '@ngneat/spectator/jest';
+
+import { FormSelectComponent } from './form-select.component';
+
+describe('FormSelectComponent', () => {
+ let spectator: Spectator<FormSelectComponent>;
+
+ const createComponent = createComponentFactory<FormSelectComponent>({
+ component: FormSelectComponent,
+ imports: [ReactiveFormsModule]
+ });
+
+ beforeEach(() => (spectator = createComponent()));
+
+ it('should set the correct option on standard select', () => {
+ const select = spectator.query('#test-single-select') as HTMLSelectElement;
+ spectator.selectOption(select, '1');
+ expect(select).toHaveSelectedOptions('1');
+ });
+});

projects/spectator/jest/test/form-select/form-select.component.ts

@@ -0,0 +1,21 @@
+import { Component, ChangeDetectionStrategy } from '@angular/core';
+
+@Component({
+ selector: 'app-form-select',
+ template: `
+ <select id="test-single-select">
+ <option value="1">1</option>
+ <option value="2">2</option>
+ <option value="3">3</option>
+ </select>
+ `,
+ changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class FormSelectComponent {
+ /**
+ * Empty method to spy on
+ */
+ public handleChange(): void {
+ return;
+ }
+}