ngx-speculoos documentation
  1. Classes
  2. TestInput

File

src/lib/test-input.ts

Description

A wrapped DOM HTML input element, providing additional methods and attributes helping with writing tests

Extends

TestHtmlElement

Index

Methods
Accessors

Constructor

constructor(tester: ComponentTester<>, debugElement: DebugElement)
Defined in src/lib/test-input.ts:8
Parameters :
Name Type Optional
tester ComponentTester<> No
debugElement DebugElement No

Methods

check
check()
Defined in src/lib/test-input.ts:46

Checks the wrapped input, then dispatches an event of type change and triggers a change detection

Returns : void
fillWith
fillWith(value: string)
Defined in src/lib/test-input.ts:17

Sets the value of the wrapped input, then dispatches an event of type input and triggers a change detection

Parameters :
Name Type Optional Description
value string No

the new value of the input
Returns : void
uncheck
uncheck()
Defined in src/lib/test-input.ts:54

Unchecks the wrapped input, then dispatches an event of type change and triggers a change detection

Returns : void
click
click()
Inherited from TestHtmlElement
Defined in TestHtmlElement:16

Clicks on the wrapped element, then triggers a change detection

Returns : void
attr
attr(name: string)
Inherited from TestElement
Defined in TestElement:66

Gets the attribute of the wrapped element with the given name

Parameters :
Name Type Optional Description
name string No

the name of the attribute to get
Returns : string | null
button
button(selector: string | Type)
Inherited from TestElement
Defined in TestElement:327

Gets the first button matched by the given selector. Throws an Error if the matched element isn't actually a button.

Parameters :
Name Type Optional Description
selector string | Type<any> No

a CSS or directive selector
Returns : TestButton | null

the wrapped button, or null if no element was matched
component
component(selector: Type)
Inherited from TestElement
Defined in TestElement:335
Type parameters :
  • R

Gets the first directive matching the given component directive selector and returns its component instance

Parameters :
Name Type Optional Description
selector Type<R> No

the selector of a component directive
Returns : R
components
components(selector: Type)
Inherited from TestElement
Defined in TestElement:343
Type parameters :
  • R

Gets the directives matching the given component directive selector and returns their component instance

Parameters :
Name Type Optional Description
selector Type<R> No

the selector of a component directive
Returns : Array<R>
custom
custom(selector: string | Type, customTestElementType: Type)
Inherited from TestElement
Defined in TestElement:372
Type parameters :
  • E

Gets the element matching the given selector, and if found, creates and returns a custom TestElement of the provided type. This is useful to create custom higher-level abstractions similar to TestInput, TestSelect, etc. for custom elements or components.

Parameters :
Name Type Optional Description
selector string | Type<any> No

a CSS or directive selector
customTestElementType Type<E> No

the type of the TestElement subclass that will wrap the found element
Returns : E | null
customs
customs(selector: string | Type, customTestElementType: Type)
Inherited from TestElement
Defined in TestElement:384
Type parameters :
  • E

Gets the elements matching the given selector, and creates and returns custom TestElements of the provided type. This is useful to create custom higher-level abstractions similar to TestInput, TestSelect, etc. for custom elements or components.

Parameters :
Name Type Optional Description
selector string | Type<any> No

a CSS or directive selector
customTestElementType Type<E> No

the type of the TestElement subclass that will wrap the found elements
Returns : Array<E>
dispatchEvent
dispatchEvent(event: Event)
Inherited from TestElement
Defined in TestElement:50

dispatches the given event from the wrapped element, then triggers a change detection

Parameters :
Name Type Optional
event Event No
Returns : void
dispatchEventOfType
dispatchEventOfType(type: string)
Inherited from TestElement
Defined in TestElement:42

dispatches an event of the given type from the wrapped element, then triggers a change detection

Parameters :
Name Type Optional
type string No
Returns : void
element
element(selector: K)
Inherited from TestElement
Defined in TestElement:81
Type parameters :
  • K

Gets the first element matching the given CSS selector and wraps it into a TestElement. The actual type of the returned value is the TestElement subclass matching the type of the found element. So, if the matched element is an input for example, the method will return a TestInput.

Usage:

const testElement: TestHtmlElement<HTMLDivElement> | null = tester.element('div');
Parameters :
Name Type Optional Description
selector K No

a CSS selector
Returns : TestHtmlElement | null

the wrapped element, or null if no element matches the selector.
elements
elements(selector: K)
Inherited from TestElement
Defined in TestElement:193
Type parameters :
  • K

Gets all the elements matching the given CSS selector and wraps them into a TestElement. The actual type of the returned elements is the TestElement subclass matching the type of the found element. So, if the matched elements are inputs for example, the method will return an array of TestInput.

Usage:

const testElements: Array<TestHtmlElement<HTMLDivElement>> = tester.elements('div');
Parameters :
Name Type Optional Description
selector K No

a CSS selector
Returns : Array<TestHtmlElement<>>

the array of matched elements, empty if no element was matched
input
input(selector: string | Type)
Inherited from TestElement
Defined in TestElement:299

Gets the first input matched by the given selector. Throws an Error if the matched element isn't actually an input.

Parameters :
Name Type Optional Description
selector string | Type<any> No

a CSS or directive selector
Returns : TestInput | null

the wrapped input, or null if no element was matched
select
select(selector: string | Type)
Inherited from TestElement
Defined in TestElement:308

Gets the first select matched by the given selector. Throws an Error if the matched element isn't actually a select.

Parameters :
Name Type Optional Description
selector string | Type<any> No

a CSS or directive selector
Returns : TestSelect | null

the wrapped select, or null if no element was matched
textarea
textarea(selector: string | Type)
Inherited from TestElement
Defined in TestElement:318

Gets the first textarea matched by the given selector

Parameters :
Name Type Optional Description
selector string | Type<any> No

a CSS or directive selector
Returns : TestTextArea | null

the wrapped textarea, or null if no element was matched. Throws an Error if the matched element isn't actually a textarea.
token
token(selector: string | Type, token: ProviderToken)
Inherited from TestElement
Defined in TestElement:352
Type parameters :
  • R

Gets the first element matching the given selector, then gets the given token from its injector, or null if there is no such token

Parameters :
Name Type Optional Description
selector string | Type<any> No

a CSS or directive selector
token ProviderToken<R> No

the token to get from the matched element injector
Returns : R | null
tokens
tokens(selector: string | Type, token: ProviderToken)
Inherited from TestElement
Defined in TestElement:361
Type parameters :
  • R

Gets the elements matching the given selector, then gets their given token from their injector, or null if there is no such token

Parameters :
Name Type Optional Description
selector string | Type<any> No

a CSS or directive selector
token ProviderToken<R> No

the token to get from the matched element injector
Returns : Array<R | null>

Accessors

value
getvalue()
Defined in src/lib/test-input.ts:25

the value of the wrapped input

Returns : string
checked
getchecked()
Defined in src/lib/test-input.ts:32

the checked property of the wrapped input

Returns : boolean
disabled
getdisabled()
Defined in src/lib/test-input.ts:39

the disabled property of the wrapped input

Returns : boolean 
import { ComponentTester } from './component-tester';
import { TestHtmlElement } from './test-html-element';
import { DebugElement } from '@angular/core';

/**
 * A wrapped DOM HTML input element, providing additional methods and attributes helping with writing tests
 */
export class TestInput extends TestHtmlElement<HTMLInputElement> {
  constructor(tester: ComponentTester<unknown>, debugElement: DebugElement) {
    super(tester, debugElement);
  }

  /**
   * Sets the value of the wrapped input, then dispatches an event of type input and triggers a change detection
   * @param value the new value of the input
   */
  fillWith(value: string): void {
    this.nativeElement.value = value;
    this.dispatchEventOfType('input');
  }

  /**
   * the value of the wrapped input
   */
  get value(): string {
    return this.nativeElement.value;
  }

  /**
   * the checked property of the wrapped input
   */
  get checked(): boolean {
    return this.nativeElement.checked;
  }

  /**
   * the disabled property of the wrapped input
   */
  get disabled(): boolean {
    return this.nativeElement.disabled;
  }

  /**
   * Checks the wrapped input, then dispatches an event of type change and triggers a change detection
   */
  check(): void {
    this.nativeElement.checked = true;
    this.dispatchEventOfType('change');
  }

  /**
   * Unchecks the wrapped input, then dispatches an event of type change and triggers a change detection
   */
  uncheck(): void {
    this.nativeElement.checked = false;
    this.dispatchEventOfType('change');
  }
}

results matching ""

    No results matching ""