UNPKG

@awsui/components-react

Version:

On July 19th, 2022, we launched [Cloudscape Design System](https://cloudscape.design). Cloudscape is an evolution of AWS-UI. It consists of user interface guidelines, front-end components, design resources, and development tools for building intuitive, en

128 lines 5.91 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.AutosuggestDropdownWrapper = void 0; // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved. // SPDX-License-Identifier: Apache-2.0 const selectors_1 = require("@awsui/test-utils-core/selectors"); const utils_1 = require("@awsui/test-utils-core/utils"); const input_1 = require("../input"); const dropdown_1 = require("../internal/dropdown"); const option_1 = require("../internal/option"); const options_list_1 = require("../internal/options-list"); const styles_selectors_js_1 = require("../../../autosuggest/styles.selectors.js"); const styles_selectors_js_2 = require("../../../internal/components/dropdown/styles.selectors.js"); const styles_selectors_js_3 = require("../../../internal/components/dropdown-status/styles.selectors.js"); const styles_selectors_js_4 = require("../../../internal/components/dropdown-status/styles.selectors.js"); const styles_selectors_js_5 = require("../../../internal/components/option/styles.selectors.js"); const styles_selectors_js_6 = require("../../../internal/components/selectable-item/styles.selectors.js"); class AutosuggestDropdownWrapper extends selectors_1.ComponentWrapper { findOptions() { return this.findAll(`.${styles_selectors_js_6.default['selectable-item']}[data-test-index]`).map((elementWrapper) => new option_1.default(elementWrapper.getElement())); } /** * Returns an option from the dropdown. * * @param optionIndex 1-based index of the option to select. */ findOption(optionIndex) { return this.findComponent(`.${styles_selectors_js_6.default['selectable-item']}[data-test-index="${optionIndex}"]`, option_1.default); } /** * Returns an option from the autosuggest by it's value * * @param value The 'value' of the option. */ findOptionByValue(value) { const toReplace = (0, utils_1.escapeSelector)(value); return this.findComponent(`.${option_1.default.rootSelector}[data-value="${toReplace}"]`, option_1.default); } /** * Returns an option from the dropdown. * * @param groupIndex 1-based index of the group to select an option in. * @param optionIndex 1-based index of the option to select. */ findOptionInGroup(groupIndex, optionIndex) { return this.findComponent(`.${styles_selectors_js_6.default['selectable-item']}[data-group-index="${groupIndex}"][data-in-group-index="${optionIndex}"]`, option_1.default); } /** * Use this element to scroll through the list of options */ findOptionsContainer() { return this.findByClassName(options_list_1.default.rootSelector); } findFooterRegion() { return this.findByClassName(styles_selectors_js_4.default.root); } findOpenDropdown() { const dropdown = new dropdown_1.default(this.getElement()); return dropdown.findOpenDropdown(); } findHighlightedOption() { return this.findComponent(`.${styles_selectors_js_6.default.highlighted}`, option_1.default); } /** * Returns all the selected options. */ findDisabledOptions() { return this.findAllByClassName(styles_selectors_js_6.default.disabled).map((elementWrapper) => new option_1.default(elementWrapper.getElement())); } /** * Returns highlighted text fragments from all of the options. * Options get highlighted when they match the value of the input field. */ findHighlightedMatches() { return this.findAllByClassName(styles_selectors_js_5.default['filtering-match-highlight']); } findHighlightedAriaLiveRegion() { var _a, _b; return (_b = (_a = this.findHighlightedOption()) === null || _a === void 0 ? void 0 : _a.findByClassName(styles_selectors_js_6.default['screenreader-content'])) !== null && _b !== void 0 ? _b : null; } } exports.AutosuggestDropdownWrapper = AutosuggestDropdownWrapper; class PortalAutosuggestDropdownWrapper extends AutosuggestDropdownWrapper { findOpenDropdown() { return (0, selectors_1.createWrapper)().find(`.${styles_selectors_js_2.default.dropdown}[data-open=true]`); } } class AutosuggestWrapper extends input_1.default { /** * @param options * * expandToViewport (boolean) - Use this when the component under test is rendered with an `expandToViewport` flag. */ findDropdown(options = { expandToViewport: false }) { return options.expandToViewport ? (0, selectors_1.createWrapper)().findComponent(`.${styles_selectors_js_2.default.dropdown}[data-open=true]`, PortalAutosuggestDropdownWrapper) : new AutosuggestDropdownWrapper(this.getElement()); } /** * @param options * * expandToViewport (boolean) - Use this when the component under test is rendered with an `expandToViewport` flag. */ findStatusIndicator(options = { expandToViewport: false }) { return this.findDropdown(options).findByClassName(styles_selectors_js_3.default.root); } /** * @param options * * expandToViewport (boolean) - Use this when the component under test is rendered with an `expandToViewport` flag. */ findErrorRecoveryButton(options = { expandToViewport: false }) { return this.findDropdown(options).findByClassName(styles_selectors_js_4.default.recovery); } /** * @param options * * expandToViewport (boolean) - Use this when the component under test is rendered with an `expandToViewport` flag. */ findEnteredTextOption(options = { expandToViewport: false }) { return this.findDropdown(options).findByClassName(styles_selectors_js_6.default['has-background']); } } AutosuggestWrapper.rootSelector = styles_selectors_js_1.default.root; exports.default = AutosuggestWrapper; //# sourceMappingURL=index.js.map