wix-style-react
Version:
wix-style-react
68 lines • 3.48 kB
JavaScript
import { DataHooks } from './constants';
export const paginationCoreDriverFactory = ({ element, eventTrigger, }) => {
const pageStrip = element?.querySelector('[data-hook="page-strip"]');
const getNavButton = (name) => element?.querySelector(`[data-hook=${name}]`);
const getPageByNumber = (n) => pageStrip?.firstElementChild?.querySelector(`[data-hook~=page-${n}]`);
const getElement = (dataHook) => element?.querySelector(`[data-hook="${dataHook}"]`);
const getPageElements = () => pageStrip?.firstElementChild?.children
? Array.from(pageStrip?.firstElementChild?.children)
: [];
const inputElement = element?.querySelector('[data-hook="page-input"]');
return {
/** Returns the root element*/
root: element,
/** Returns whether the element exists */
exists: () => !!element,
/** Simulates events */
simulate: eventTrigger,
/** Returns the container of page elements */
getPageStrip: () => pageStrip,
/** Returns displayed page elements */
getPages: getPageElements,
/** Returns the text content of the displayed pages in "pages" mode */
getPageLabels: () => getPageElements().map(p => p.textContent),
/** Returns the page element given its index in the page strip */
getPageByIndex: (idx) => getPageElements()[idx || 0] || null,
/** Returns the page element given page number */
getPageByNumber,
/** Returns the page element currently selected */
getCurrentPage: () => element?.querySelector('[data-hook~="current-page"]'),
/** Returns the element for the navigation button - acceptable values are 'first', 'last', 'previous' or 'next' */
getNavButton,
/** Returns the page input element in "input" mode */
getPageInput: inputElement,
/** Returns the total amount of pages displayed in "input" mode */
getTotalPagesField: () => element?.querySelector('[data-hook="total-pages"]'),
/** Simulates clicking a nav button */
clickNavButton: (name) => {
const navButton = getNavButton(name);
if (navButton) {
eventTrigger.click(navButton);
}
},
/** Simulates clicking a page in "pages" mode */
clickPage: (page) => {
const pageButton = getPageByNumber(page);
if (pageButton) {
eventTrigger.click(pageButton);
}
},
click: () => element && eventTrigger.click(element),
/** Simulates changing the value of the input field in "input" mode */
changeInput: (newValue) => {
if (inputElement) {
inputElement.value = newValue;
eventTrigger.change(inputElement);
}
},
/** Simulates committing the input field value in "input" mode */
commitInput: () => eventTrigger.keyDown(inputElement, { keyCode: 13, key: 'Enter' }),
/** Simulates blur in the input field in "input" mode */
blurInput: () => eventTrigger.blur(inputElement),
getElement,
getPage: (pageNumber) => element?.querySelector(`[data-hook~="${DataHooks.page}-${pageNumber}"]`),
focusInput: () => eventTrigger.focus(inputElement),
getElementAttribute: (dataHook, attributeName) => getElement(dataHook)?.getAttribute(attributeName),
};
};
//# sourceMappingURL=PaginationCore.driver.js.map