@@ -109,7 +109,7 @@ declare global {
109109 */
110110 dataCy(value : string ): Chainable <Element >
111111 }
112- }
112+ }
113113}
114114```
115115
@@ -122,9 +122,9 @@ by any users of your custom command.
122122
123123<Alert type =" info " >
124124
125- Please note, types of all the parameters taken by implementation callback are
126- inferred automatically based on declared interface. Thus, in the example above
127- the ` value ` will be of type ` string ` implicitly.
125+ Types of all the parameters taken by the implementation callback are inferred
126+ automatically based on the declared interface. Thus, in the example above, the
127+ ` value ` will be of type ` string ` implicitly.
128128
129129</Alert >
130130
@@ -142,8 +142,8 @@ it('works', () => {
142142
143143#### Adding child or dual commands
144144
145- When you add a custom command with ` prevSubject ` Cypress will infer subject type
146- automatically based on kind of specified ` prevSubject ` (s)
145+ When you add a custom command with ` prevSubject ` , Cypress will infer the subject
146+ type automatically based on the specified ` prevSubject ` .
147147
148148``` typescript
149149// in cypress/support/index.ts
@@ -154,62 +154,70 @@ declare global {
154154 namespace Cypress {
155155 interface Chainable {
156156 /**
157- * Custom command to type few random words into input elements
157+ * Custom command to type a few random words into input elements
158158 * @param count =3
159159 * @example cy.get('input').typeRandomWords()
160160 */
161- typeRandomWords(count ? : number , options ? : Partial <TypeOptions >): Chainable <Element >
161+ typeRandomWords(
162+ count ? : number ,
163+ options ? : Partial <TypeOptions >
164+ ): Chainable <Element >
162165 }
163- }
166+ }
164167}
165168```
166169
167170``` typescript
168171// cypress/support/index.ts
169- Cypress .Commands .add (' typeRandomWords' , {prevSubject: ' element' }, (
170- subject /* :JQuery<HTMLElement> */ , count = 3 , options ? ,
172+ Cypress .Commands .add (' typeRandomWords' , { prevSubject: ' element' }, (
173+ subject /* :JQuery<HTMLElement> */ ,
174+ count = 3 ,
175+ options ?
171176) => {
172- return cy .wrap (subject ).type (generateRandomWords (cound ), options )
177+ return cy .wrap (subject ).type (generateRandomWords (count ), options )
173178})
174179```
175180
176-
177181#### Overwriting child or dual commands
178182
179- When overwriting either built-in or custom commands which make use of ` prevSubject `
180- you have to help the type-checker to understand this.
183+ When overwriting either built-in or custom commands which make use of
184+ ` prevSubject ` , you must specify generic parameters to help the type-checker to
185+ understand the type of the ` prevSubject ` .
181186
182187``` typescript
183188interface TypeOptions extends Cypress .TypeOptions {
184189 sensitive: boolean
185190}
186191
187- Cypress .Commands .overwrite <' type' , ' element' >(' type' , (
188- originalFn , element , text , options ? : Partial <TypeOptions >,
189- ) => {
190- if (options && options .sensitive ) {
191- // turn off original log
192- options .log = false
193- // create our own log with masked message
194- Cypress .log ({
195- $el: element ,
196- name: ' type' ,
197- message: ' *' .repeat (text .length ),
198- })
192+ Cypress .Commands .overwrite <' type' , ' element' >(
193+ ' type' ,
194+ (originalFn , element , text , options ? : Partial <TypeOptions >) => {
195+ if (options && options .sensitive ) {
196+ // turn off original log
197+ options .log = false
198+ // create our own log with masked message
199+ Cypress .log ({
200+ $el: element ,
201+ name: ' type' ,
202+ message: ' *' .repeat (text .length ),
203+ })
204+ }
205+
206+ return originalFn (element , text , options )
199207 }
200-
201- return originalFn (element , text , options )
202- })
208+ )
203209```
204210
205211As you can see there are generic parameters ` <'type', 'element'> ` are used:
206212
207- 1 . This is the command name, should equal to actual first parameter passed to ` cy.overwite `
208- 2 . Type of prevSubject that is used by the original command. Possible values:
209- - 'element' will infer second param as ` JQuery<HTMLElement> `
210- - 'window' will infer second param as ` Window `
211- - 'document' will infer second param as ` Document `
212- - 'optional' will infer second param as ` unknown `
213+ 1 . The first parameter is the command name, equal to first parameter passed to
214+ ` Cypress.Commands.overwrite ` .
215+ 2 . The second parameter is the type of the ` prevSubject ` that is used by the
216+ original command. Possible values:
217+ - 'element' infers it as ` JQuery<HTMLElement> `
218+ - 'window' infers it as ` Window `
219+ - 'document' infers it as ` Document `
220+ - 'optional' infers it as ` unknown `
213221
214222#### Examples:
215223
0 commit comments