1 | import { __awaiter } from 'tslib';
|
---|
2 | import { TestKey, _getTextWithExcludedElements, HarnessEnvironment } from '@angular/cdk/testing';
|
---|
3 | import * as webdriver from 'selenium-webdriver';
|
---|
4 |
|
---|
5 | /**
|
---|
6 | * @license
|
---|
7 | * Copyright Google LLC All Rights Reserved.
|
---|
8 | *
|
---|
9 | * Use of this source code is governed by an MIT-style license that can be
|
---|
10 | * found in the LICENSE file at https://angular.io/license
|
---|
11 | */
|
---|
12 | /**
|
---|
13 | * Maps the `TestKey` constants to WebDriver's `webdriver.Key` constants.
|
---|
14 | * See https://github.com/SeleniumHQ/selenium/blob/trunk/javascript/webdriver/key.js#L29
|
---|
15 | */
|
---|
16 | const seleniumWebDriverKeyMap = {
|
---|
17 | [TestKey.BACKSPACE]: webdriver.Key.BACK_SPACE,
|
---|
18 | [TestKey.TAB]: webdriver.Key.TAB,
|
---|
19 | [TestKey.ENTER]: webdriver.Key.ENTER,
|
---|
20 | [TestKey.SHIFT]: webdriver.Key.SHIFT,
|
---|
21 | [TestKey.CONTROL]: webdriver.Key.CONTROL,
|
---|
22 | [TestKey.ALT]: webdriver.Key.ALT,
|
---|
23 | [TestKey.ESCAPE]: webdriver.Key.ESCAPE,
|
---|
24 | [TestKey.PAGE_UP]: webdriver.Key.PAGE_UP,
|
---|
25 | [TestKey.PAGE_DOWN]: webdriver.Key.PAGE_DOWN,
|
---|
26 | [TestKey.END]: webdriver.Key.END,
|
---|
27 | [TestKey.HOME]: webdriver.Key.HOME,
|
---|
28 | [TestKey.LEFT_ARROW]: webdriver.Key.ARROW_LEFT,
|
---|
29 | [TestKey.UP_ARROW]: webdriver.Key.ARROW_UP,
|
---|
30 | [TestKey.RIGHT_ARROW]: webdriver.Key.ARROW_RIGHT,
|
---|
31 | [TestKey.DOWN_ARROW]: webdriver.Key.ARROW_DOWN,
|
---|
32 | [TestKey.INSERT]: webdriver.Key.INSERT,
|
---|
33 | [TestKey.DELETE]: webdriver.Key.DELETE,
|
---|
34 | [TestKey.F1]: webdriver.Key.F1,
|
---|
35 | [TestKey.F2]: webdriver.Key.F2,
|
---|
36 | [TestKey.F3]: webdriver.Key.F3,
|
---|
37 | [TestKey.F4]: webdriver.Key.F4,
|
---|
38 | [TestKey.F5]: webdriver.Key.F5,
|
---|
39 | [TestKey.F6]: webdriver.Key.F6,
|
---|
40 | [TestKey.F7]: webdriver.Key.F7,
|
---|
41 | [TestKey.F8]: webdriver.Key.F8,
|
---|
42 | [TestKey.F9]: webdriver.Key.F9,
|
---|
43 | [TestKey.F10]: webdriver.Key.F10,
|
---|
44 | [TestKey.F11]: webdriver.Key.F11,
|
---|
45 | [TestKey.F12]: webdriver.Key.F12,
|
---|
46 | [TestKey.META]: webdriver.Key.META
|
---|
47 | };
|
---|
48 | /** Gets a list of WebDriver `Key`s for the given `ModifierKeys`. */
|
---|
49 | function getSeleniumWebDriverModifierKeys(modifiers) {
|
---|
50 | const result = [];
|
---|
51 | if (modifiers.control) {
|
---|
52 | result.push(webdriver.Key.CONTROL);
|
---|
53 | }
|
---|
54 | if (modifiers.alt) {
|
---|
55 | result.push(webdriver.Key.ALT);
|
---|
56 | }
|
---|
57 | if (modifiers.shift) {
|
---|
58 | result.push(webdriver.Key.SHIFT);
|
---|
59 | }
|
---|
60 | if (modifiers.meta) {
|
---|
61 | result.push(webdriver.Key.META);
|
---|
62 | }
|
---|
63 | return result;
|
---|
64 | }
|
---|
65 |
|
---|
66 | /**
|
---|
67 | * @license
|
---|
68 | * Copyright Google LLC All Rights Reserved.
|
---|
69 | *
|
---|
70 | * Use of this source code is governed by an MIT-style license that can be
|
---|
71 | * found in the LICENSE file at https://angular.io/license
|
---|
72 | */
|
---|
73 | /** A `TestElement` implementation for WebDriver. */
|
---|
74 | class SeleniumWebDriverElement {
|
---|
75 | constructor(element, _stabilize) {
|
---|
76 | this.element = element;
|
---|
77 | this._stabilize = _stabilize;
|
---|
78 | }
|
---|
79 | /** Blur the element. */
|
---|
80 | blur() {
|
---|
81 | return __awaiter(this, void 0, void 0, function* () {
|
---|
82 | yield this._executeScript(((element) => element.blur()), this.element());
|
---|
83 | yield this._stabilize();
|
---|
84 | });
|
---|
85 | }
|
---|
86 | /** Clear the element's input (for input and textarea elements only). */
|
---|
87 | clear() {
|
---|
88 | return __awaiter(this, void 0, void 0, function* () {
|
---|
89 | yield this.element().clear();
|
---|
90 | yield this._stabilize();
|
---|
91 | });
|
---|
92 | }
|
---|
93 | click(...args) {
|
---|
94 | return __awaiter(this, void 0, void 0, function* () {
|
---|
95 | yield this._dispatchClickEventSequence(args, webdriver.Button.LEFT);
|
---|
96 | yield this._stabilize();
|
---|
97 | });
|
---|
98 | }
|
---|
99 | rightClick(...args) {
|
---|
100 | return __awaiter(this, void 0, void 0, function* () {
|
---|
101 | yield this._dispatchClickEventSequence(args, webdriver.Button.RIGHT);
|
---|
102 | yield this._stabilize();
|
---|
103 | });
|
---|
104 | }
|
---|
105 | /** Focus the element. */
|
---|
106 | focus() {
|
---|
107 | return __awaiter(this, void 0, void 0, function* () {
|
---|
108 | yield this._executeScript((element) => element.focus(), this.element());
|
---|
109 | yield this._stabilize();
|
---|
110 | });
|
---|
111 | }
|
---|
112 | /** Get the computed value of the given CSS property for the element. */
|
---|
113 | getCssValue(property) {
|
---|
114 | return __awaiter(this, void 0, void 0, function* () {
|
---|
115 | yield this._stabilize();
|
---|
116 | return this.element().getCssValue(property);
|
---|
117 | });
|
---|
118 | }
|
---|
119 | /** Hovers the mouse over the element. */
|
---|
120 | hover() {
|
---|
121 | return __awaiter(this, void 0, void 0, function* () {
|
---|
122 | yield this._actions().mouseMove(this.element()).perform();
|
---|
123 | yield this._stabilize();
|
---|
124 | });
|
---|
125 | }
|
---|
126 | /** Moves the mouse away from the element. */
|
---|
127 | mouseAway() {
|
---|
128 | return __awaiter(this, void 0, void 0, function* () {
|
---|
129 | yield this._actions().mouseMove(this.element(), { x: -1, y: -1 }).perform();
|
---|
130 | yield this._stabilize();
|
---|
131 | });
|
---|
132 | }
|
---|
133 | sendKeys(...modifiersAndKeys) {
|
---|
134 | return __awaiter(this, void 0, void 0, function* () {
|
---|
135 | const first = modifiersAndKeys[0];
|
---|
136 | let modifiers;
|
---|
137 | let rest;
|
---|
138 | if (typeof first !== 'string' && typeof first !== 'number') {
|
---|
139 | modifiers = first;
|
---|
140 | rest = modifiersAndKeys.slice(1);
|
---|
141 | }
|
---|
142 | else {
|
---|
143 | modifiers = {};
|
---|
144 | rest = modifiersAndKeys;
|
---|
145 | }
|
---|
146 | const modifierKeys = getSeleniumWebDriverModifierKeys(modifiers);
|
---|
147 | const keys = rest.map(k => typeof k === 'string' ? k.split('') : [seleniumWebDriverKeyMap[k]])
|
---|
148 | .reduce((arr, k) => arr.concat(k), [])
|
---|
149 | // webdriver.Key.chord doesn't work well with geckodriver (mozilla/geckodriver#1502),
|
---|
150 | // so avoid it if no modifier keys are required.
|
---|
151 | .map(k => modifierKeys.length > 0 ? webdriver.Key.chord(...modifierKeys, k) : k);
|
---|
152 | yield this.element().sendKeys(...keys);
|
---|
153 | yield this._stabilize();
|
---|
154 | });
|
---|
155 | }
|
---|
156 | /**
|
---|
157 | * Gets the text from the element.
|
---|
158 | * @param options Options that affect what text is included.
|
---|
159 | */
|
---|
160 | text(options) {
|
---|
161 | return __awaiter(this, void 0, void 0, function* () {
|
---|
162 | yield this._stabilize();
|
---|
163 | if (options === null || options === void 0 ? void 0 : options.exclude) {
|
---|
164 | return this._executeScript(_getTextWithExcludedElements, this.element(), options.exclude);
|
---|
165 | }
|
---|
166 | // We don't go through the WebDriver `getText`, because it excludes text from hidden elements.
|
---|
167 | return this._executeScript((element) => (element.textContent || '').trim(), this.element());
|
---|
168 | });
|
---|
169 | }
|
---|
170 | /** Gets the value for the given attribute from the element. */
|
---|
171 | getAttribute(name) {
|
---|
172 | return __awaiter(this, void 0, void 0, function* () {
|
---|
173 | yield this._stabilize();
|
---|
174 | return this._executeScript((element, attribute) => element.getAttribute(attribute), this.element(), name);
|
---|
175 | });
|
---|
176 | }
|
---|
177 | /** Checks whether the element has the given class. */
|
---|
178 | hasClass(name) {
|
---|
179 | return __awaiter(this, void 0, void 0, function* () {
|
---|
180 | yield this._stabilize();
|
---|
181 | const classes = (yield this.getAttribute('class')) || '';
|
---|
182 | return new Set(classes.split(/\s+/).filter(c => c)).has(name);
|
---|
183 | });
|
---|
184 | }
|
---|
185 | /** Gets the dimensions of the element. */
|
---|
186 | getDimensions() {
|
---|
187 | return __awaiter(this, void 0, void 0, function* () {
|
---|
188 | yield this._stabilize();
|
---|
189 | const { width, height } = yield this.element().getSize();
|
---|
190 | const { x: left, y: top } = yield this.element().getLocation();
|
---|
191 | return { width, height, left, top };
|
---|
192 | });
|
---|
193 | }
|
---|
194 | /** Gets the value of a property of an element. */
|
---|
195 | getProperty(name) {
|
---|
196 | return __awaiter(this, void 0, void 0, function* () {
|
---|
197 | yield this._stabilize();
|
---|
198 | return this._executeScript((element, property) => element[property], this.element(), name);
|
---|
199 | });
|
---|
200 | }
|
---|
201 | /** Sets the value of a property of an input. */
|
---|
202 | setInputValue(newValue) {
|
---|
203 | return __awaiter(this, void 0, void 0, function* () {
|
---|
204 | yield this._executeScript((element, value) => element.value = value, this.element(), newValue);
|
---|
205 | yield this._stabilize();
|
---|
206 | });
|
---|
207 | }
|
---|
208 | /** Selects the options at the specified indexes inside of a native `select` element. */
|
---|
209 | selectOptions(...optionIndexes) {
|
---|
210 | return __awaiter(this, void 0, void 0, function* () {
|
---|
211 | yield this._stabilize();
|
---|
212 | const options = yield this.element().findElements(webdriver.By.css('option'));
|
---|
213 | const indexes = new Set(optionIndexes); // Convert to a set to remove duplicates.
|
---|
214 | if (options.length && indexes.size) {
|
---|
215 | // Reset the value so all the selected states are cleared. We can
|
---|
216 | // reuse the input-specific method since the logic is the same.
|
---|
217 | yield this.setInputValue('');
|
---|
218 | for (let i = 0; i < options.length; i++) {
|
---|
219 | if (indexes.has(i)) {
|
---|
220 | // We have to hold the control key while clicking on options so that multiple can be
|
---|
221 | // selected in multi-selection mode. The key doesn't do anything for single selection.
|
---|
222 | yield this._actions().keyDown(webdriver.Key.CONTROL).perform();
|
---|
223 | yield options[i].click();
|
---|
224 | yield this._actions().keyUp(webdriver.Key.CONTROL).perform();
|
---|
225 | }
|
---|
226 | }
|
---|
227 | yield this._stabilize();
|
---|
228 | }
|
---|
229 | });
|
---|
230 | }
|
---|
231 | /** Checks whether this element matches the given selector. */
|
---|
232 | matchesSelector(selector) {
|
---|
233 | return __awaiter(this, void 0, void 0, function* () {
|
---|
234 | yield this._stabilize();
|
---|
235 | return this._executeScript((element, s) => (Element.prototype.matches || Element.prototype.msMatchesSelector)
|
---|
236 | .call(element, s), this.element(), selector);
|
---|
237 | });
|
---|
238 | }
|
---|
239 | /** Checks whether the element is focused. */
|
---|
240 | isFocused() {
|
---|
241 | return __awaiter(this, void 0, void 0, function* () {
|
---|
242 | yield this._stabilize();
|
---|
243 | return webdriver.WebElement.equals(this.element(), this.element().getDriver().switchTo().activeElement());
|
---|
244 | });
|
---|
245 | }
|
---|
246 | /**
|
---|
247 | * Dispatches an event with a particular name.
|
---|
248 | * @param name Name of the event to be dispatched.
|
---|
249 | */
|
---|
250 | dispatchEvent(name, data) {
|
---|
251 | return __awaiter(this, void 0, void 0, function* () {
|
---|
252 | yield this._executeScript(dispatchEvent, name, this.element(), data);
|
---|
253 | yield this._stabilize();
|
---|
254 | });
|
---|
255 | }
|
---|
256 | /** Gets the webdriver action sequence. */
|
---|
257 | _actions() {
|
---|
258 | return this.element().getDriver().actions();
|
---|
259 | }
|
---|
260 | /** Executes a function in the browser. */
|
---|
261 | _executeScript(script, ...var_args) {
|
---|
262 | return __awaiter(this, void 0, void 0, function* () {
|
---|
263 | return this.element().getDriver().executeScript(script, ...var_args);
|
---|
264 | });
|
---|
265 | }
|
---|
266 | /** Dispatches all the events that are part of a click event sequence. */
|
---|
267 | _dispatchClickEventSequence(args, button) {
|
---|
268 | return __awaiter(this, void 0, void 0, function* () {
|
---|
269 | let modifiers = {};
|
---|
270 | if (args.length && typeof args[args.length - 1] === 'object') {
|
---|
271 | modifiers = args.pop();
|
---|
272 | }
|
---|
273 | const modifierKeys = getSeleniumWebDriverModifierKeys(modifiers);
|
---|
274 | // Omitting the offset argument to mouseMove results in clicking the center.
|
---|
275 | // This is the default behavior we want, so we use an empty array of offsetArgs if
|
---|
276 | // no args remain after popping the modifiers from the args passed to this function.
|
---|
277 | const offsetArgs = (args.length === 2 ?
|
---|
278 | [{ x: args[0], y: args[1] }] : []);
|
---|
279 | let actions = this._actions().mouseMove(this.element(), ...offsetArgs);
|
---|
280 | for (const modifierKey of modifierKeys) {
|
---|
281 | actions = actions.keyDown(modifierKey);
|
---|
282 | }
|
---|
283 | actions = actions.click(button);
|
---|
284 | for (const modifierKey of modifierKeys) {
|
---|
285 | actions = actions.keyUp(modifierKey);
|
---|
286 | }
|
---|
287 | yield actions.perform();
|
---|
288 | });
|
---|
289 | }
|
---|
290 | }
|
---|
291 | /**
|
---|
292 | * Dispatches an event with a particular name and data to an element. Note that this needs to be a
|
---|
293 | * pure function, because it gets stringified by WebDriver and is executed inside the browser.
|
---|
294 | */
|
---|
295 | function dispatchEvent(name, element, data) {
|
---|
296 | const event = document.createEvent('Event');
|
---|
297 | event.initEvent(name);
|
---|
298 | // tslint:disable-next-line:ban Have to use `Object.assign` to preserve the original object.
|
---|
299 | Object.assign(event, data || {});
|
---|
300 | element.dispatchEvent(event);
|
---|
301 | }
|
---|
302 |
|
---|
303 | /**
|
---|
304 | * @license
|
---|
305 | * Copyright Google LLC All Rights Reserved.
|
---|
306 | *
|
---|
307 | * Use of this source code is governed by an MIT-style license that can be
|
---|
308 | * found in the LICENSE file at https://angular.io/license
|
---|
309 | */
|
---|
310 | /** The default environment options. */
|
---|
311 | const defaultEnvironmentOptions = {
|
---|
312 | queryFn: (selector, root) => __awaiter(void 0, void 0, void 0, function* () { return root().findElements(webdriver.By.css(selector)); })
|
---|
313 | };
|
---|
314 | /**
|
---|
315 | * This function is meant to be executed in the browser. It taps into the hooks exposed by Angular
|
---|
316 | * and invokes the specified `callback` when the application is stable (no more pending tasks).
|
---|
317 | */
|
---|
318 | function whenStable(callback) {
|
---|
319 | Promise.all(window.frameworkStabilizers.map(stabilizer => new Promise(stabilizer)))
|
---|
320 | .then(callback);
|
---|
321 | }
|
---|
322 | /**
|
---|
323 | * This function is meant to be executed in the browser. It checks whether the Angular framework has
|
---|
324 | * bootstrapped yet.
|
---|
325 | */
|
---|
326 | function isBootstrapped() {
|
---|
327 | return !!window.frameworkStabilizers;
|
---|
328 | }
|
---|
329 | /** Waits for angular to be ready after the page load. */
|
---|
330 | function waitForAngularReady(wd) {
|
---|
331 | return __awaiter(this, void 0, void 0, function* () {
|
---|
332 | yield wd.wait(() => wd.executeScript(isBootstrapped));
|
---|
333 | yield wd.executeAsyncScript(whenStable);
|
---|
334 | });
|
---|
335 | }
|
---|
336 | /** A `HarnessEnvironment` implementation for WebDriver. */
|
---|
337 | class SeleniumWebDriverHarnessEnvironment extends HarnessEnvironment {
|
---|
338 | constructor(rawRootElement, options) {
|
---|
339 | super(rawRootElement);
|
---|
340 | this._options = Object.assign(Object.assign({}, defaultEnvironmentOptions), options);
|
---|
341 | }
|
---|
342 | /** Gets the ElementFinder corresponding to the given TestElement. */
|
---|
343 | static getNativeElement(el) {
|
---|
344 | if (el instanceof SeleniumWebDriverElement) {
|
---|
345 | return el.element();
|
---|
346 | }
|
---|
347 | throw Error('This TestElement was not created by the WebDriverHarnessEnvironment');
|
---|
348 | }
|
---|
349 | /** Creates a `HarnessLoader` rooted at the document root. */
|
---|
350 | static loader(driver, options) {
|
---|
351 | return new SeleniumWebDriverHarnessEnvironment(() => driver.findElement(webdriver.By.css('body')), options);
|
---|
352 | }
|
---|
353 | /**
|
---|
354 | * Flushes change detection and async tasks captured in the Angular zone.
|
---|
355 | * In most cases it should not be necessary to call this manually. However, there may be some edge
|
---|
356 | * cases where it is needed to fully flush animation events.
|
---|
357 | */
|
---|
358 | forceStabilize() {
|
---|
359 | return __awaiter(this, void 0, void 0, function* () {
|
---|
360 | yield this.rawRootElement().getDriver().executeAsyncScript(whenStable);
|
---|
361 | });
|
---|
362 | }
|
---|
363 | /** @docs-private */
|
---|
364 | waitForTasksOutsideAngular() {
|
---|
365 | return __awaiter(this, void 0, void 0, function* () {
|
---|
366 | // TODO: figure out how we can do this for the webdriver environment.
|
---|
367 | // https://github.com/angular/components/issues/17412
|
---|
368 | });
|
---|
369 | }
|
---|
370 | /** Gets the root element for the document. */
|
---|
371 | getDocumentRoot() {
|
---|
372 | return () => this.rawRootElement().getDriver().findElement(webdriver.By.css('body'));
|
---|
373 | }
|
---|
374 | /** Creates a `TestElement` from a raw element. */
|
---|
375 | createTestElement(element) {
|
---|
376 | return new SeleniumWebDriverElement(element, () => this.forceStabilize());
|
---|
377 | }
|
---|
378 | /** Creates a `HarnessLoader` rooted at the given raw element. */
|
---|
379 | createEnvironment(element) {
|
---|
380 | return new SeleniumWebDriverHarnessEnvironment(element, this._options);
|
---|
381 | }
|
---|
382 | // Note: This seems to be working, though we may need to re-evaluate if we encounter issues with
|
---|
383 | // stale element references. `() => Promise<webdriver.WebElement[]>` seems like a more correct
|
---|
384 | // return type, though supporting it would require changes to the public harness API.
|
---|
385 | /**
|
---|
386 | * Gets a list of all elements matching the given selector under this environment's root element.
|
---|
387 | */
|
---|
388 | getAllRawElements(selector) {
|
---|
389 | return __awaiter(this, void 0, void 0, function* () {
|
---|
390 | const els = yield this._options.queryFn(selector, this.rawRootElement);
|
---|
391 | return els.map((x) => () => x);
|
---|
392 | });
|
---|
393 | }
|
---|
394 | }
|
---|
395 |
|
---|
396 | /**
|
---|
397 | * @license
|
---|
398 | * Copyright Google LLC All Rights Reserved.
|
---|
399 | *
|
---|
400 | * Use of this source code is governed by an MIT-style license that can be
|
---|
401 | * found in the LICENSE file at https://angular.io/license
|
---|
402 | */
|
---|
403 |
|
---|
404 | /**
|
---|
405 | * @license
|
---|
406 | * Copyright Google LLC All Rights Reserved.
|
---|
407 | *
|
---|
408 | * Use of this source code is governed by an MIT-style license that can be
|
---|
409 | * found in the LICENSE file at https://angular.io/license
|
---|
410 | */
|
---|
411 |
|
---|
412 | export { SeleniumWebDriverElement, SeleniumWebDriverHarnessEnvironment, waitForAngularReady };
|
---|
413 | //# sourceMappingURL=selenium-webdriver.js.map
|
---|