@elastic/eui-test-helpers 1.4.0-snapshot.1788177701701 → 1.5.0

package/README.md

@@ -51,6 +51,9 @@ their own version at runtime.
 | `EuiSuperSelectObject` | [src/components/form/super_select/README.md](src/components/form/super_select/README.md) |
 | `EuiGlobalToastListObject` | [src/components/toast/README.md](src/components/toast/README.md) |
 | `EuiSelectableObject` | [src/components/selectable/README.md](src/components/selectable/README.md) |
+| `EuiDraggableObject` | [src/components/drag_and_drop/README.md](src/components/drag_and_drop/README.md) |
+| `EuiFilterButtonObject` | [src/components/filter_button/README.md](src/components/filter_button/README.md) |
+| `EuiRangeObject` | [src/components/form/range/README.md](src/components/form/range/README.md) |
 | `EuiBasicTableObject` | [src/components/basic_table/README.md](src/components/basic_table/README.md) |
 
 ## Contributing

package/lib/cjs/components/drag_and_drop/selectors.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/drag-and-drop/|EuiDraggable}.
+ * `*_SELECTOR` values are CSS.
+ */
+export declare const EuiDraggableSelectors: {
+    /**
+     * Attribute `@hello-pangea/dnd` (which `EuiDraggable` wraps) spreads onto an
+     * enabled drag handle. Used to verify `testSubj` actually points at a handle,
+     * not a fixed EUI class — the handle markup itself is consumer-defined.
+     */
+    HANDLE_SELECTOR: string;
+    /** Attribute `@hello-pangea/dnd` spreads onto every draggable item wrapper, enabled or not. */
+    ITEM_SELECTOR: string;
+};

package/lib/cjs/components/drag_and_drop/selectors.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EuiDraggableSelectors = void 0;
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/drag-and-drop/|EuiDraggable}.
+ * `*_SELECTOR` values are CSS.
+ */
+const EuiDraggableSelectors = exports.EuiDraggableSelectors = {
+  /**
+   * Attribute `@hello-pangea/dnd` (which `EuiDraggable` wraps) spreads onto an
+   * enabled drag handle. Used to verify `testSubj` actually points at a handle,
+   * not a fixed EUI class — the handle markup itself is consumer-defined.
+   */
+  HANDLE_SELECTOR: '[data-rfd-drag-handle-draggable-id]',
+  /** Attribute `@hello-pangea/dnd` spreads onto every draggable item wrapper, enabled or not. */
+  ITEM_SELECTOR: '[data-rfd-draggable-id]'
+};

package/lib/cjs/components/filter_button/selectors.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/forms/filter-group/|EuiFilterButton}.
+ * `*_SELECTOR` values are CSS, `*_CLASS` values are class names to check for
+ * membership (e.g. via `toHaveClass`).
+ */
+export declare const EuiFilterButtonSelectors: {
+    /** Root element (the button itself carries the consumer's `data-test-subj`). */
+    ROOT_SELECTOR: string;
+    /** The notification badge, present only when `numFilters` or `numActiveFilters` is set. */
+    NOTIFICATION_SELECTOR: string;
+    /** Set when `hasActiveFilters` is true. */
+    HAS_ACTIVE_FILTERS_CLASS: string;
+    /** Set when `isSelected` is true (e.g. a popover-toggle button while its popover is open). */
+    IS_SELECTED_CLASS: string;
+};

package/lib/cjs/components/filter_button/selectors.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EuiFilterButtonSelectors = void 0;
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/forms/filter-group/|EuiFilterButton}.
+ * `*_SELECTOR` values are CSS, `*_CLASS` values are class names to check for
+ * membership (e.g. via `toHaveClass`).
+ */
+const EuiFilterButtonSelectors = exports.EuiFilterButtonSelectors = {
+  /** Root element (the button itself carries the consumer's `data-test-subj`). */
+  ROOT_SELECTOR: '.euiFilterButton',
+  /** The notification badge, present only when `numFilters` or `numActiveFilters` is set. */
+  NOTIFICATION_SELECTOR: '.euiFilterButton__notification',
+  /** Set when `hasActiveFilters` is true. */
+  HAS_ACTIVE_FILTERS_CLASS: 'euiFilterButton-hasActiveFilters',
+  /** Set when `isSelected` is true (e.g. a popover-toggle button while its popover is open). */
+  IS_SELECTED_CLASS: 'euiFilterButton-isSelected'
+};

package/lib/cjs/components/form/range/selectors.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/forms/range-controls/|EuiRange}
+ * and `EuiDualRange`. `*_SELECTOR` values are CSS.
+ */
+export declare const EuiRangeSelectors: {
+    /** The native `<input type="range">` element that carries the actual value. */
+    SLIDER_SELECTOR: string;
+    /** The visible number input, rendered on a plain `EuiRange` with `showInput`. See the package README for why it can share `data-test-subj` with {@link SLIDER_SELECTOR}. */
+    NUMBER_INPUT_SELECTOR: string;
+};

package/lib/cjs/components/form/range/selectors.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EuiRangeSelectors = void 0;
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/forms/range-controls/|EuiRange}
+ * and `EuiDualRange`. `*_SELECTOR` values are CSS.
+ */
+const EuiRangeSelectors = exports.EuiRangeSelectors = {
+  /** The native `<input type="range">` element that carries the actual value. */
+  SLIDER_SELECTOR: '.euiRangeSlider',
+  /** The visible number input, rendered on a plain `EuiRange` with `showInput`. See the package README for why it can share `data-test-subj` with {@link SLIDER_SELECTOR}. */
+  NUMBER_INPUT_SELECTOR: '.euiRangeInput'
+};

package/lib/cjs/index.d.ts

@@ -4,4 +4,7 @@ export { EuiDataGridObject } from './playwright/components/datagrid/object';
 export { EuiSuperSelectObject } from './playwright/components/form/super_select/object';
 export { EuiGlobalToastListObject } from './playwright/components/toast/object';
 export { EuiSelectableObject } from './playwright/components/selectable/object';
+export { EuiDraggableObject } from './playwright/components/drag_and_drop/object';
+export { EuiFilterButtonObject } from './playwright/components/filter_button/object';
+export { EuiRangeObject } from './playwright/components/form/range/object';
 export { EuiBasicTableObject } from './playwright/components/basic_table/object';

package/lib/cjs/index.js

@@ -12,7 +12,7 @@ Object.defineProperty(exports, "BaseObject", {
 Object.defineProperty(exports, "EuiBasicTableObject", {
   enumerable: true,
   get: function () {
-    return _object6.EuiBasicTableObject;
+    return _object9.EuiBasicTableObject;
   }
 });
 Object.defineProperty(exports, "EuiComboBoxObject", {
@@ -27,12 +27,30 @@ Object.defineProperty(exports, "EuiDataGridObject", {
     return _object2.EuiDataGridObject;
   }
 });
+Object.defineProperty(exports, "EuiDraggableObject", {
+  enumerable: true,
+  get: function () {
+    return _object6.EuiDraggableObject;
+  }
+});
+Object.defineProperty(exports, "EuiFilterButtonObject", {
+  enumerable: true,
+  get: function () {
+    return _object7.EuiFilterButtonObject;
+  }
+});
 Object.defineProperty(exports, "EuiGlobalToastListObject", {
   enumerable: true,
   get: function () {
     return _object4.EuiGlobalToastListObject;
   }
 });
+Object.defineProperty(exports, "EuiRangeObject", {
+  enumerable: true,
+  get: function () {
+    return _object8.EuiRangeObject;
+  }
+});
 Object.defineProperty(exports, "EuiSelectableObject", {
   enumerable: true,
   get: function () {
@@ -51,4 +69,7 @@ var _object2 = require("./playwright/components/datagrid/object");
 var _object3 = require("./playwright/components/form/super_select/object");
 var _object4 = require("./playwright/components/toast/object");
 var _object5 = require("./playwright/components/selectable/object");
-var _object6 = require("./playwright/components/basic_table/object");
+var _object6 = require("./playwright/components/drag_and_drop/object");
+var _object7 = require("./playwright/components/filter_button/object");
+var _object8 = require("./playwright/components/form/range/object");
+var _object9 = require("./playwright/components/basic_table/object");

package/lib/cjs/playwright/components/drag_and_drop/object.d.ts

@@ -0,0 +1,21 @@
+import { BaseObject, type ObjectScope } from '../../base_object';
+/**
+ * Playwright Component Object for a keyboard-reorderable {@link
+ * https://eui.elastic.co/docs/components/drag-and-drop/ EuiDraggable} item.
+ *
+ * `testSubj` must be set on the item's own drag handle — with the default
+ * `customDragHandle={false}` that's the `EuiDraggable` item itself; with a
+ * custom handle it's that inner element instead. See the package README for
+ * details, the component-type guard, and why there's no settle-wait after a
+ * reorder.
+ */
+export declare class EuiDraggableObject extends BaseObject {
+    constructor(scope: ObjectScope, testSubj: string);
+    /**
+     * Reorders the item via keyboard: focus the handle, lift it (`Space`),
+     * move it `steps` positions (`ArrowDown` for positive, `ArrowUp` for
+     * negative), drop it (`Space`). Keyboard lift, not a simulated mouse drag —
+     * `@hello-pangea/dnd`'s own accessible interaction.
+     */
+    reorder(steps: number): Promise<void>;
+}

package/lib/cjs/playwright/components/drag_and_drop/object.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EuiDraggableObject = void 0;
+var _base_object = require("../../base_object");
+var _selectors = require("../../../components/drag_and_drop/selectors");
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Playwright Component Object for a keyboard-reorderable {@link
+ * https://eui.elastic.co/docs/components/drag-and-drop/ EuiDraggable} item.
+ *
+ * `testSubj` must be set on the item's own drag handle — with the default
+ * `customDragHandle={false}` that's the `EuiDraggable` item itself; with a
+ * custom handle it's that inner element instead. See the package README for
+ * details, the component-type guard, and why there's no settle-wait after a
+ * reorder.
+ */
+class EuiDraggableObject extends _base_object.BaseObject {
+  constructor(scope, testSubj) {
+    super(scope, testSubj, _selectors.EuiDraggableSelectors.HANDLE_SELECTOR);
+  }
+
+  /**
+   * Reorders the item via keyboard: focus the handle, lift it (`Space`),
+   * move it `steps` positions (`ArrowDown` for positive, `ArrowUp` for
+   * negative), drop it (`Space`). Keyboard lift, not a simulated mouse drag —
+   * `@hello-pangea/dnd`'s own accessible interaction.
+   */
+  async reorder(steps) {
+    await this.root.focus();
+    await this.root.press('Space');
+    const key = steps > 0 ? 'ArrowDown' : 'ArrowUp';
+    for (let i = 0; i < Math.abs(steps); i++) {
+      await this.root.press(key);
+    }
+    await this.root.press('Space');
+  }
+}
+exports.EuiDraggableObject = EuiDraggableObject;

package/lib/cjs/playwright/components/filter_button/object.d.ts

@@ -0,0 +1,31 @@
+import type { Locator } from '@playwright/test';
+import { BaseObject, type ObjectScope } from '../../base_object';
+/**
+ * Playwright Component Object for {@link
+ * https://eui.elastic.co/docs/components/forms/filter-group/ EuiFilterButton}.
+ *
+ * `testSubj` must match the `data-test-subj` set by the consumer on the
+ * `<EuiFilterButton>` (EUI spreads it onto the button itself). Deliberately
+ * does not own opening/closing a popover triggered by the button — `EuiPopover`
+ * already sets `aria-expanded`/`aria-controls` on its toggle synchronously
+ * itself, so drive that from the test directly. It also does not own reading
+ * or selecting options inside that popover — when the popover content is an
+ * `EuiSelectable`, use {@link EuiSelectableObject} scoped to it instead.
+ */
+export declare class EuiFilterButtonObject extends BaseObject {
+    constructor(scope: ObjectScope, testSubj: string);
+    /**
+     * The notification badge showing the available/active filter count, as a
+     * `Locator` so callers keep Playwright auto-retry for its text
+     * (e.g. `expect(filterButton.notificationBadge).toHaveText('2')`). Only
+     * present when the consumer passes `numFilters` or `numActiveFilters` —
+     * absent otherwise, so assert presence first if that is in question.
+     *
+     * For the button's own active/selected state, assert directly on
+     * {@link BaseObject.locator} rather than through a dedicated method — both
+     * are synchronous CSS classes EUI sets on the root
+     * (`euiFilterButton-hasActiveFilters`, `euiFilterButton-isSelected`), e.g.
+     * `expect(filterButton.locator).toHaveClass(/euiFilterButton-hasActiveFilters/)`.
+     */
+    get notificationBadge(): Locator;
+}

package/lib/cjs/playwright/components/filter_button/object.js

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EuiFilterButtonObject = void 0;
+var _base_object = require("../../base_object");
+var _selectors = require("../../../components/filter_button/selectors");
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Playwright Component Object for {@link
+ * https://eui.elastic.co/docs/components/forms/filter-group/ EuiFilterButton}.
+ *
+ * `testSubj` must match the `data-test-subj` set by the consumer on the
+ * `<EuiFilterButton>` (EUI spreads it onto the button itself). Deliberately
+ * does not own opening/closing a popover triggered by the button — `EuiPopover`
+ * already sets `aria-expanded`/`aria-controls` on its toggle synchronously
+ * itself, so drive that from the test directly. It also does not own reading
+ * or selecting options inside that popover — when the popover content is an
+ * `EuiSelectable`, use {@link EuiSelectableObject} scoped to it instead.
+ */
+class EuiFilterButtonObject extends _base_object.BaseObject {
+  constructor(scope, testSubj) {
+    super(scope, testSubj, _selectors.EuiFilterButtonSelectors.ROOT_SELECTOR);
+  }
+
+  /**
+   * The notification badge showing the available/active filter count, as a
+   * `Locator` so callers keep Playwright auto-retry for its text
+   * (e.g. `expect(filterButton.notificationBadge).toHaveText('2')`). Only
+   * present when the consumer passes `numFilters` or `numActiveFilters` —
+   * absent otherwise, so assert presence first if that is in question.
+   *
+   * For the button's own active/selected state, assert directly on
+   * {@link BaseObject.locator} rather than through a dedicated method — both
+   * are synchronous CSS classes EUI sets on the root
+   * (`euiFilterButton-hasActiveFilters`, `euiFilterButton-isSelected`), e.g.
+   * `expect(filterButton.locator).toHaveClass(/euiFilterButton-hasActiveFilters/)`.
+   */
+  get notificationBadge() {
+    return this.root.locator(_selectors.EuiFilterButtonSelectors.NOTIFICATION_SELECTOR);
+  }
+}
+exports.EuiFilterButtonObject = EuiFilterButtonObject;

package/lib/cjs/playwright/components/form/range/object.d.ts

@@ -0,0 +1,25 @@
+import type { Locator } from '@playwright/test';
+import { BaseObject, type ObjectScope } from '../../../base_object';
+/**
+ * Playwright Component Object for {@link
+ * https://eui.elastic.co/docs/components/forms/range-controls/ EuiRange} and
+ * `EuiDualRange`.
+ *
+ * `testSubj` must match the `data-test-subj` set by the consumer on the
+ * `<EuiRange>`/`<EuiDualRange>`. See the package README for why `slider` and
+ * `numberInput` disambiguate by class, and what this does not cover.
+ */
+export declare class EuiRangeObject extends BaseObject {
+    constructor(scope: ObjectScope, testSubj: string);
+    /**
+     * The native range slider input. Resolves to exactly one element once
+     * mounted. With `showInput="inputWithPopover"`, it lives inside the
+     * popover panel and is not mounted until the popover opens.
+     */
+    get slider(): Locator;
+    /**
+     * The visible number input, present only with `showInput`. Resolves to
+     * zero elements otherwise.
+     */
+    get numberInput(): Locator;
+}

package/lib/cjs/playwright/components/form/range/object.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EuiRangeObject = void 0;
+var _base_object = require("../../../base_object");
+var _selectors = require("../../../../components/form/range/selectors");
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Playwright Component Object for {@link
+ * https://eui.elastic.co/docs/components/forms/range-controls/ EuiRange} and
+ * `EuiDualRange`.
+ *
+ * `testSubj` must match the `data-test-subj` set by the consumer on the
+ * `<EuiRange>`/`<EuiDualRange>`. See the package README for why `slider` and
+ * `numberInput` disambiguate by class, and what this does not cover.
+ */
+class EuiRangeObject extends _base_object.BaseObject {
+  constructor(scope, testSubj) {
+    super(scope, testSubj, _selectors.EuiRangeSelectors.SLIDER_SELECTOR);
+  }
+
+  /**
+   * The native range slider input. Resolves to exactly one element once
+   * mounted. With `showInput="inputWithPopover"`, it lives inside the
+   * popover panel and is not mounted until the popover opens.
+   */
+  get slider() {
+    return this.root.and(this.scope.locator(_selectors.EuiRangeSelectors.SLIDER_SELECTOR));
+  }
+
+  /**
+   * The visible number input, present only with `showInput`. Resolves to
+   * zero elements otherwise.
+   */
+  get numberInput() {
+    return this.root.and(this.scope.locator(_selectors.EuiRangeSelectors.NUMBER_INPUT_SELECTOR));
+  }
+}
+exports.EuiRangeObject = EuiRangeObject;

package/lib/esm/components/drag_and_drop/selectors.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/drag-and-drop/|EuiDraggable}.
+ * `*_SELECTOR` values are CSS.
+ */
+export declare const EuiDraggableSelectors: {
+    /**
+     * Attribute `@hello-pangea/dnd` (which `EuiDraggable` wraps) spreads onto an
+     * enabled drag handle. Used to verify `testSubj` actually points at a handle,
+     * not a fixed EUI class — the handle markup itself is consumer-defined.
+     */
+    HANDLE_SELECTOR: string;
+    /** Attribute `@hello-pangea/dnd` spreads onto every draggable item wrapper, enabled or not. */
+    ITEM_SELECTOR: string;
+};

package/lib/esm/components/drag_and_drop/selectors.js

@@ -0,0 +1,23 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/drag-and-drop/|EuiDraggable}.
+ * `*_SELECTOR` values are CSS.
+ */
+export const EuiDraggableSelectors = {
+    /**
+     * Attribute `@hello-pangea/dnd` (which `EuiDraggable` wraps) spreads onto an
+     * enabled drag handle. Used to verify `testSubj` actually points at a handle,
+     * not a fixed EUI class — the handle markup itself is consumer-defined.
+     */
+    HANDLE_SELECTOR: '[data-rfd-drag-handle-draggable-id]',
+    /** Attribute `@hello-pangea/dnd` spreads onto every draggable item wrapper, enabled or not. */
+    ITEM_SELECTOR: '[data-rfd-draggable-id]',
+};
+//# sourceMappingURL=selectors.js.map

package/lib/esm/components/drag_and_drop/selectors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectors.js","sourceRoot":"","sources":["../../../../src/components/drag_and_drop/selectors.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH;;;;GAIG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG;IACnC;;;;OAIG;IACH,eAAe,EAAE,qCAAqC;IAEtD,+FAA+F;IAC/F,aAAa,EAAE,yBAAyB;CACzC,CAAC"}

package/lib/esm/components/filter_button/selectors.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/forms/filter-group/|EuiFilterButton}.
+ * `*_SELECTOR` values are CSS, `*_CLASS` values are class names to check for
+ * membership (e.g. via `toHaveClass`).
+ */
+export declare const EuiFilterButtonSelectors: {
+    /** Root element (the button itself carries the consumer's `data-test-subj`). */
+    ROOT_SELECTOR: string;
+    /** The notification badge, present only when `numFilters` or `numActiveFilters` is set. */
+    NOTIFICATION_SELECTOR: string;
+    /** Set when `hasActiveFilters` is true. */
+    HAS_ACTIVE_FILTERS_CLASS: string;
+    /** Set when `isSelected` is true (e.g. a popover-toggle button while its popover is open). */
+    IS_SELECTED_CLASS: string;
+};

package/lib/esm/components/filter_button/selectors.js

@@ -0,0 +1,24 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/forms/filter-group/|EuiFilterButton}.
+ * `*_SELECTOR` values are CSS, `*_CLASS` values are class names to check for
+ * membership (e.g. via `toHaveClass`).
+ */
+export const EuiFilterButtonSelectors = {
+    /** Root element (the button itself carries the consumer's `data-test-subj`). */
+    ROOT_SELECTOR: '.euiFilterButton',
+    /** The notification badge, present only when `numFilters` or `numActiveFilters` is set. */
+    NOTIFICATION_SELECTOR: '.euiFilterButton__notification',
+    /** Set when `hasActiveFilters` is true. */
+    HAS_ACTIVE_FILTERS_CLASS: 'euiFilterButton-hasActiveFilters',
+    /** Set when `isSelected` is true (e.g. a popover-toggle button while its popover is open). */
+    IS_SELECTED_CLASS: 'euiFilterButton-isSelected',
+};
+//# sourceMappingURL=selectors.js.map

package/lib/esm/components/filter_button/selectors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectors.js","sourceRoot":"","sources":["../../../../src/components/filter_button/selectors.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACtC,gFAAgF;IAChF,aAAa,EAAE,kBAAkB;IAEjC,2FAA2F;IAC3F,qBAAqB,EAAE,gCAAgC;IAEvD,2CAA2C;IAC3C,wBAAwB,EAAE,kCAAkC;IAE5D,8FAA8F;IAC9F,iBAAiB,EAAE,4BAA4B;CAChD,CAAC"}

package/lib/esm/components/form/range/selectors.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/forms/range-controls/|EuiRange}
+ * and `EuiDualRange`. `*_SELECTOR` values are CSS.
+ */
+export declare const EuiRangeSelectors: {
+    /** The native `<input type="range">` element that carries the actual value. */
+    SLIDER_SELECTOR: string;
+    /** The visible number input, rendered on a plain `EuiRange` with `showInput`. See the package README for why it can share `data-test-subj` with {@link SLIDER_SELECTOR}. */
+    NUMBER_INPUT_SELECTOR: string;
+};

package/lib/esm/components/form/range/selectors.js

@@ -0,0 +1,19 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+/**
+ * Stable selectors for
+ * {@link https://eui.elastic.co/docs/components/forms/range-controls/|EuiRange}
+ * and `EuiDualRange`. `*_SELECTOR` values are CSS.
+ */
+export const EuiRangeSelectors = {
+    /** The native `<input type="range">` element that carries the actual value. */
+    SLIDER_SELECTOR: '.euiRangeSlider',
+    /** The visible number input, rendered on a plain `EuiRange` with `showInput`. See the package README for why it can share `data-test-subj` with {@link SLIDER_SELECTOR}. */
+    NUMBER_INPUT_SELECTOR: '.euiRangeInput',
+};
+//# sourceMappingURL=selectors.js.map

package/lib/esm/components/form/range/selectors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectors.js","sourceRoot":"","sources":["../../../../../src/components/form/range/selectors.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH;;;;GAIG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,+EAA+E;IAC/E,eAAe,EAAE,iBAAiB;IAElC,4KAA4K;IAC5K,qBAAqB,EAAE,gBAAgB;CACxC,CAAC"}

package/lib/esm/index.d.ts

@@ -4,4 +4,7 @@ export { EuiDataGridObject } from './playwright/components/datagrid/object';
 export { EuiSuperSelectObject } from './playwright/components/form/super_select/object';
 export { EuiGlobalToastListObject } from './playwright/components/toast/object';
 export { EuiSelectableObject } from './playwright/components/selectable/object';
+export { EuiDraggableObject } from './playwright/components/drag_and_drop/object';
+export { EuiFilterButtonObject } from './playwright/components/filter_button/object';
+export { EuiRangeObject } from './playwright/components/form/range/object';
 export { EuiBasicTableObject } from './playwright/components/basic_table/object';

package/lib/esm/index.js

@@ -11,5 +11,8 @@ export { EuiDataGridObject } from './playwright/components/datagrid/object';
 export { EuiSuperSelectObject } from './playwright/components/form/super_select/object';
 export { EuiGlobalToastListObject } from './playwright/components/toast/object';
 export { EuiSelectableObject } from './playwright/components/selectable/object';
+export { EuiDraggableObject } from './playwright/components/drag_and_drop/object';
+export { EuiFilterButtonObject } from './playwright/components/filter_button/object';
+export { EuiRangeObject } from './playwright/components/form/range/object';
 export { EuiBasicTableObject } from './playwright/components/basic_table/object';
 //# sourceMappingURL=index.js.map

package/lib/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,UAAU,EAAoB,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,iBAAiB,EAAE,MAAM,0CAA0C,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,yCAAyC,CAAC;AAC5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,kDAAkD,CAAC;AACxF,OAAO,EAAE,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAChF,OAAO,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAChF,OAAO,EAAE,mBAAmB,EAAE,MAAM,4CAA4C,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,UAAU,EAAoB,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,iBAAiB,EAAE,MAAM,0CAA0C,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,yCAAyC,CAAC;AAC5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,kDAAkD,CAAC;AACxF,OAAO,EAAE,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAChF,OAAO,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAChF,OAAO,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AAClF,OAAO,EAAE,qBAAqB,EAAE,MAAM,8CAA8C,CAAC;AACrF,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,mBAAmB,EAAE,MAAM,4CAA4C,CAAC"}

package/lib/esm/playwright/components/drag_and_drop/object.d.ts

@@ -0,0 +1,21 @@
+import { BaseObject, type ObjectScope } from '../../base_object';
+/**
+ * Playwright Component Object for a keyboard-reorderable {@link
+ * https://eui.elastic.co/docs/components/drag-and-drop/ EuiDraggable} item.
+ *
+ * `testSubj` must be set on the item's own drag handle — with the default
+ * `customDragHandle={false}` that's the `EuiDraggable` item itself; with a
+ * custom handle it's that inner element instead. See the package README for
+ * details, the component-type guard, and why there's no settle-wait after a
+ * reorder.
+ */
+export declare class EuiDraggableObject extends BaseObject {
+    constructor(scope: ObjectScope, testSubj: string);
+    /**
+     * Reorders the item via keyboard: focus the handle, lift it (`Space`),
+     * move it `steps` positions (`ArrowDown` for positive, `ArrowUp` for
+     * negative), drop it (`Space`). Keyboard lift, not a simulated mouse drag —
+     * `@hello-pangea/dnd`'s own accessible interaction.
+     */
+    reorder(steps: number): Promise<void>;
+}

package/lib/esm/playwright/components/drag_and_drop/object.js

@@ -0,0 +1,40 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+import { BaseObject } from '../../base_object';
+import { EuiDraggableSelectors } from '../../../components/drag_and_drop/selectors';
+/**
+ * Playwright Component Object for a keyboard-reorderable {@link
+ * https://eui.elastic.co/docs/components/drag-and-drop/ EuiDraggable} item.
+ *
+ * `testSubj` must be set on the item's own drag handle — with the default
+ * `customDragHandle={false}` that's the `EuiDraggable` item itself; with a
+ * custom handle it's that inner element instead. See the package README for
+ * details, the component-type guard, and why there's no settle-wait after a
+ * reorder.
+ */
+export class EuiDraggableObject extends BaseObject {
+    constructor(scope, testSubj) {
+        super(scope, testSubj, EuiDraggableSelectors.HANDLE_SELECTOR);
+    }
+    /**
+     * Reorders the item via keyboard: focus the handle, lift it (`Space`),
+     * move it `steps` positions (`ArrowDown` for positive, `ArrowUp` for
+     * negative), drop it (`Space`). Keyboard lift, not a simulated mouse drag —
+     * `@hello-pangea/dnd`'s own accessible interaction.
+     */
+    async reorder(steps) {
+        await this.root.focus();
+        await this.root.press('Space');
+        const key = steps > 0 ? 'ArrowDown' : 'ArrowUp';
+        for (let i = 0; i < Math.abs(steps); i++) {
+            await this.root.press(key);
+        }
+        await this.root.press('Space');
+    }
+}
+//# sourceMappingURL=object.js.map

package/lib/esm/playwright/components/drag_and_drop/object.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"object.js","sourceRoot":"","sources":["../../../../../src/playwright/components/drag_and_drop/object.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,UAAU,EAAoB,MAAM,mBAAmB,CAAC;AACjE,OAAO,EAAE,qBAAqB,EAAE,MAAM,6CAA6C,CAAC;AAEpF;;;;;;;;;GASG;AACH,MAAM,OAAO,kBAAmB,SAAQ,UAAU;IAChD,YAAY,KAAkB,EAAE,QAAgB;QAC9C,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAC;IAChE,CAAC;IAED;;;;;OAKG;IACH,KAAK,CAAC,OAAO,CAAC,KAAa;QACzB,MAAM,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;QACxB,MAAM,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAC/B,MAAM,GAAG,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC;QAChD,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzC,MAAM,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC7B,CAAC;QACD,MAAM,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACjC,CAAC;CACF"}

package/lib/esm/playwright/components/filter_button/object.d.ts

@@ -0,0 +1,31 @@
+import type { Locator } from '@playwright/test';
+import { BaseObject, type ObjectScope } from '../../base_object';
+/**
+ * Playwright Component Object for {@link
+ * https://eui.elastic.co/docs/components/forms/filter-group/ EuiFilterButton}.
+ *
+ * `testSubj` must match the `data-test-subj` set by the consumer on the
+ * `<EuiFilterButton>` (EUI spreads it onto the button itself). Deliberately
+ * does not own opening/closing a popover triggered by the button — `EuiPopover`
+ * already sets `aria-expanded`/`aria-controls` on its toggle synchronously
+ * itself, so drive that from the test directly. It also does not own reading
+ * or selecting options inside that popover — when the popover content is an
+ * `EuiSelectable`, use {@link EuiSelectableObject} scoped to it instead.
+ */
+export declare class EuiFilterButtonObject extends BaseObject {
+    constructor(scope: ObjectScope, testSubj: string);
+    /**
+     * The notification badge showing the available/active filter count, as a
+     * `Locator` so callers keep Playwright auto-retry for its text
+     * (e.g. `expect(filterButton.notificationBadge).toHaveText('2')`). Only
+     * present when the consumer passes `numFilters` or `numActiveFilters` —
+     * absent otherwise, so assert presence first if that is in question.
+     *
+     * For the button's own active/selected state, assert directly on
+     * {@link BaseObject.locator} rather than through a dedicated method — both
+     * are synchronous CSS classes EUI sets on the root
+     * (`euiFilterButton-hasActiveFilters`, `euiFilterButton-isSelected`), e.g.
+     * `expect(filterButton.locator).toHaveClass(/euiFilterButton-hasActiveFilters/)`.
+     */
+    get notificationBadge(): Locator;
+}

package/lib/esm/playwright/components/filter_button/object.js

@@ -0,0 +1,43 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+import { BaseObject } from '../../base_object';
+import { EuiFilterButtonSelectors } from '../../../components/filter_button/selectors';
+/**
+ * Playwright Component Object for {@link
+ * https://eui.elastic.co/docs/components/forms/filter-group/ EuiFilterButton}.
+ *
+ * `testSubj` must match the `data-test-subj` set by the consumer on the
+ * `<EuiFilterButton>` (EUI spreads it onto the button itself). Deliberately
+ * does not own opening/closing a popover triggered by the button — `EuiPopover`
+ * already sets `aria-expanded`/`aria-controls` on its toggle synchronously
+ * itself, so drive that from the test directly. It also does not own reading
+ * or selecting options inside that popover — when the popover content is an
+ * `EuiSelectable`, use {@link EuiSelectableObject} scoped to it instead.
+ */
+export class EuiFilterButtonObject extends BaseObject {
+    constructor(scope, testSubj) {
+        super(scope, testSubj, EuiFilterButtonSelectors.ROOT_SELECTOR);
+    }
+    /**
+     * The notification badge showing the available/active filter count, as a
+     * `Locator` so callers keep Playwright auto-retry for its text
+     * (e.g. `expect(filterButton.notificationBadge).toHaveText('2')`). Only
+     * present when the consumer passes `numFilters` or `numActiveFilters` —
+     * absent otherwise, so assert presence first if that is in question.
+     *
+     * For the button's own active/selected state, assert directly on
+     * {@link BaseObject.locator} rather than through a dedicated method — both
+     * are synchronous CSS classes EUI sets on the root
+     * (`euiFilterButton-hasActiveFilters`, `euiFilterButton-isSelected`), e.g.
+     * `expect(filterButton.locator).toHaveClass(/euiFilterButton-hasActiveFilters/)`.
+     */
+    get notificationBadge() {
+        return this.root.locator(EuiFilterButtonSelectors.NOTIFICATION_SELECTOR);
+    }
+}
+//# sourceMappingURL=object.js.map

package/lib/esm/playwright/components/filter_button/object.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"object.js","sourceRoot":"","sources":["../../../../../src/playwright/components/filter_button/object.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAE,UAAU,EAAoB,MAAM,mBAAmB,CAAC;AACjE,OAAO,EAAE,wBAAwB,EAAE,MAAM,6CAA6C,CAAC;AAEvF;;;;;;;;;;;GAWG;AACH,MAAM,OAAO,qBAAsB,SAAQ,UAAU;IACnD,YAAY,KAAkB,EAAE,QAAgB;QAC9C,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,wBAAwB,CAAC,aAAa,CAAC,CAAC;IACjE,CAAC;IAED;;;;;;;;;;;;OAYG;IACH,IAAW,iBAAiB;QAC1B,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,qBAAqB,CAAC,CAAC;IAC3E,CAAC;CACF"}

package/lib/esm/playwright/components/form/range/object.d.ts

@@ -0,0 +1,25 @@
+import type { Locator } from '@playwright/test';
+import { BaseObject, type ObjectScope } from '../../../base_object';
+/**
+ * Playwright Component Object for {@link
+ * https://eui.elastic.co/docs/components/forms/range-controls/ EuiRange} and
+ * `EuiDualRange`.
+ *
+ * `testSubj` must match the `data-test-subj` set by the consumer on the
+ * `<EuiRange>`/`<EuiDualRange>`. See the package README for why `slider` and
+ * `numberInput` disambiguate by class, and what this does not cover.
+ */
+export declare class EuiRangeObject extends BaseObject {
+    constructor(scope: ObjectScope, testSubj: string);
+    /**
+     * The native range slider input. Resolves to exactly one element once
+     * mounted. With `showInput="inputWithPopover"`, it lives inside the
+     * popover panel and is not mounted until the popover opens.
+     */
+    get slider(): Locator;
+    /**
+     * The visible number input, present only with `showInput`. Resolves to
+     * zero elements otherwise.
+     */
+    get numberInput(): Locator;
+}

package/lib/esm/playwright/components/form/range/object.js

@@ -0,0 +1,39 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+import { BaseObject } from '../../../base_object';
+import { EuiRangeSelectors } from '../../../../components/form/range/selectors';
+/**
+ * Playwright Component Object for {@link
+ * https://eui.elastic.co/docs/components/forms/range-controls/ EuiRange} and
+ * `EuiDualRange`.
+ *
+ * `testSubj` must match the `data-test-subj` set by the consumer on the
+ * `<EuiRange>`/`<EuiDualRange>`. See the package README for why `slider` and
+ * `numberInput` disambiguate by class, and what this does not cover.
+ */
+export class EuiRangeObject extends BaseObject {
+    constructor(scope, testSubj) {
+        super(scope, testSubj, EuiRangeSelectors.SLIDER_SELECTOR);
+    }
+    /**
+     * The native range slider input. Resolves to exactly one element once
+     * mounted. With `showInput="inputWithPopover"`, it lives inside the
+     * popover panel and is not mounted until the popover opens.
+     */
+    get slider() {
+        return this.root.and(this.scope.locator(EuiRangeSelectors.SLIDER_SELECTOR));
+    }
+    /**
+     * The visible number input, present only with `showInput`. Resolves to
+     * zero elements otherwise.
+     */
+    get numberInput() {
+        return this.root.and(this.scope.locator(EuiRangeSelectors.NUMBER_INPUT_SELECTOR));
+    }
+}
+//# sourceMappingURL=object.js.map

package/lib/esm/playwright/components/form/range/object.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"object.js","sourceRoot":"","sources":["../../../../../../src/playwright/components/form/range/object.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAE,UAAU,EAAoB,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6CAA6C,CAAC;AAEhF;;;;;;;;GAQG;AACH,MAAM,OAAO,cAAe,SAAQ,UAAU;IAC5C,YAAY,KAAkB,EAAE,QAAgB;QAC9C,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,iBAAiB,CAAC,eAAe,CAAC,CAAC;IAC5D,CAAC;IAED;;;;OAIG;IACH,IAAW,MAAM;QACf,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,eAAe,CAAC,CAAC,CAAC;IAC9E,CAAC;IAED;;;OAGG;IACH,IAAW,WAAW;QACpB,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,CAAC,CAAC;IACpF,CAAC;CACF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elastic/eui-test-helpers",
-  "version": "1.4.0-snapshot.1788177701701",
+  "version": "1.5.0",
   "description": "A library of EUI test helpers for RTL, Cypress and Scout",
   "license": "SEE LICENSE IN LICENSE.txt",
   "repository": {
@@ -57,6 +57,5 @@
     "!**/*.spec.js.map",
     "README.md",
     "licenses"
-  ],
-  "stableVersion": "1.4.0"
+  ]
 }

package/src/components/drag_and_drop/README.md

@@ -0,0 +1,23 @@
+# EuiDraggableObject
+
+Playwright Component Object for [EuiDraggable](https://eui.elastic.co/docs/components/drag-and-drop/), keyboard-reordering items instead of simulating a mouse drag.
+
+## Usage
+
+```ts
+import { EuiDraggableObject } from '@elastic/eui-test-helpers';
+
+const item = new EuiDraggableObject(page, 'myItemDragHandle');
+await item.reorder(2); // move 2 positions later
+await item.reorder(-1); // move 1 position earlier
+```
+
+Set `data-test-subj` on the item's own drag handle — the element EUI's `provided.dragHandleProps` are spread onto. With the default `customDragHandle={false}`, that's the `<EuiDraggable>` item itself (as in the usage example above and the `Playground` story), since EUI spreads `dragHandleProps` onto the same element as `draggableProps` in that case. Only with a `customDragHandle` does the handle become a distinct inner element, and `data-test-subj` must move there instead. The component-type guard checks for the `data-rfd-drag-handle-draggable-id` attribute `@hello-pangea/dnd` spreads onto an *enabled* handle, since the handle markup itself is consumer-defined, not a fixed EUI class. A disabled draggable's handle lacks that attribute, so pointing this object at one throws the same "wrong component" error as pointing it at a non-handle element — a disabled item can't be reordered either way.
+
+## API
+
+| Member | Description |
+|---|---|
+| `reorder(steps)` | Focuses the handle, lifts it, moves it `steps` positions (`ArrowDown` for positive, `ArrowUp` for negative), drops it. |
+
+`reorder` drives `EuiDraggable` (which wraps `@hello-pangea/dnd`) via its keyboard interaction — the library's own accessible alternative to a mouse drag, and one that doesn't require simulating drag events. It does not wait for a settle signal after dropping: EUI doesn't expose a synchronous, stable one (the `euiDraggable--isDragging` class some consumers checked for hasn't existed since this styling moved to Emotion — that check was always a no-op). Assert the resulting order with a retrying `expect`, which settles on its own.

package/src/components/filter_button/README.md

@@ -0,0 +1,29 @@
+# EuiFilterButtonObject
+
+Playwright Component Object for [EuiFilterButton](https://eui.elastic.co/docs/components/forms/filter-group/).
+
+## Usage
+
+```ts
+import { EuiFilterButtonObject } from '@elastic/eui-test-helpers';
+
+const filterButton = new EuiFilterButtonObject(page, 'myFilterButton');
+await expect(filterButton.locator).toHaveClass(/euiFilterButton-hasActiveFilters/);
+await expect(filterButton.notificationBadge).toHaveText('2');
+```
+
+Set `data-test-subj` on the `<EuiFilterButton>` (EUI spreads it onto the button itself, which the component-type guard verifies).
+
+## API
+
+| Member | Description |
+|---|---|
+| `locator` | Inherited root `Locator`. Assert the button's active/selected state directly on it, e.g. `toHaveClass(/euiFilterButton-hasActiveFilters/)` or `toHaveClass(/euiFilterButton-isSelected/)` — both are synchronous CSS classes EUI sets, not async state. |
+| `notificationBadge` | `Locator` for the filter-count badge. Only present when the consumer passes `numFilters` or `numActiveFilters`. |
+
+## Deliberately out of scope
+
+This component does not own opening or closing a popover the button triggers, or reading/selecting options inside it:
+
+- **Popover mechanics**: `EuiPopover` already sets `aria-expanded`/`aria-controls` on its toggle button synchronously itself. Drive open/close from your test directly against those, or the popover's own `isOpen` prop in your app.
+- **Option selection**: when the popover content is an `EuiSelectable`, scope [`EuiSelectableObject`](../selectable/README.md) to it instead of reimplementing option matching here.

package/src/components/form/range/README.md

@@ -0,0 +1,31 @@
+# EuiRangeObject
+
+Playwright Component Object for [EuiRange](https://eui.elastic.co/docs/components/forms/range-controls/) and `EuiDualRange`.
+
+## Usage
+
+```ts
+import { EuiRangeObject } from '@elastic/eui-test-helpers';
+
+const range = new EuiRangeObject(page, 'myRange');
+await range.slider.fill('50'); // or press arrow keys, drag, etc.
+```
+
+Set `data-test-subj` on the `<EuiRange>`/`<EuiDualRange>` (EUI spreads it onto the native range slider, which the component-type guard verifies).
+
+## Why this exists
+
+On a plain `EuiRange` rendered with `showInput`, EUI spreads the *same* `data-test-subj` onto both the native slider and the visible number input. A plain `page.getByTestId(x)` then resolves to two elements and throws in Playwright's strict mode. That is a real, non-obvious EUI gap this component exists to hide.
+
+## API
+
+| Member | Description |
+|---|---|
+| `slider` | `Locator` for the native `<input type="range">`. Resolves to exactly one element once mounted. With `showInput="inputWithPopover"`, the slider lives inside the popover panel and is not mounted until the popover opens (focus/click `numberInput` to open it). |
+| `numberInput` | `Locator` for the visible number input. Only present on a plain `EuiRange` with `showInput` set, resolves to zero elements otherwise. |
+
+## Deliberately out of scope
+
+- **`EuiDualRange`'s min/max number inputs**: rendered only with `showInput`, and need their own `data-test-subj` via `minInputProps`/`maxInputProps`. That is the consumer's own test-subj to target directly, not ambiguous the way the plain `EuiRange` case is.
+- **`inputWithPopover` open/close** (`EuiRange` and `EuiDualRange` both support this mode): the popover only opens by clicking a number input, not the delimiter between them. That is a real EUI behavioral quirk, but a single documented fact rather than DOM ambiguity, and popover mechanics are already exposed synchronously by `EuiPopover` itself (`aria-expanded`/`aria-controls`). Drive it from your test directly.
+- **Reading the current value**: use `slider.inputValue()` or `numberInput.inputValue()` directly, no wrapper needed.