@24i/bigscreen-sdk 1.0.0-alpha.2054 → 1.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@24i/bigscreen-sdk",
-    "version": "1.0.0-alpha.2054",
+    "version": "1.0.0",
     "description": "SmartApps BIGscreen SDK monorepo",
     "main": "index.js",
     "scripts": {
@@ -111,7 +111,6 @@
         "./driver-kreatv": "./packages/driver-kreatv/src/index.ts",
         "./driver-saphi": "./packages/driver-saphi/src/index.ts",
         "./driver-tizen": "./packages/driver-tizen/src/index.ts",
-        "./driver-vidaa": "./packages/driver-vidaa/src/index.ts",
         "./driver-webos/scripts/template": "./packages/driver-webos/scripts/template.ts",
         "./driver-webos/scripts/exportWebOSTVjs": "./packages/driver-webos/scripts/exportWebOSTVjs.ts",
         "./driver-webos": "./packages/driver-webos/src/index.ts",

package/packages/developer-tools/src/EnvironmentSelection/styles/EnvironmentSelection.scss

@@ -111,7 +111,7 @@
         }
 
         .leading-ellipses-list-item {
-            height: auto;
+            height: fit-content;
         }
     }
 }

package/packages/device/src/resolver/resolver.ts

@@ -5,7 +5,6 @@ import { DeviceHbbTV } from '@24i/bigscreen-sdk/driver-hbbtv';
 import { DeviceKreaTV } from '@24i/bigscreen-sdk/driver-kreatv';
 import { DeviceSaphi } from '@24i/bigscreen-sdk/driver-saphi';
 import { DeviceTizen } from '@24i/bigscreen-sdk/driver-tizen';
-import { DeviceVidaa } from '@24i/bigscreen-sdk/driver-vidaa';
 import { DeviceWebos } from '@24i/bigscreen-sdk/driver-webos';
 import { DeviceXbox } from '@24i/bigscreen-sdk/driver-xbox';
 
@@ -31,10 +30,6 @@ const getDevice = () => {
         info('Saphi');
         return new DeviceSaphi();
     }
-    if (userAgent.match(/Hisense/)) {
-        info('VIDAA');
-        return new DeviceVidaa();
-    }
     if (userAgent.match(/Ekioh/)) {
         info('KreaTV');
         return new DeviceKreaTV();

package/packages/focus/src/__test__/candidate.spec.tsx

@@ -0,0 +1,245 @@
+import { Component, createRef, removeNode } from '@24i/bigscreen-sdk/jsx';
+import { shallow, MountedComponent } from '@24i/bigscreen-sdk/jsx/test-utils';
+import {
+    focusCandidate,
+    setFocusCandidate,
+    setActiveElementAsFocusCandidate,
+    setNextFocusCandidate,
+    setCandidateFallback,
+    getLastCandidate,
+    getCandidateStack,
+    clearCandidateStack,
+} from '../candidate';
+
+class MockComponent extends Component<{}> {
+    wrapperRef = createRef<HTMLDivElement>();
+
+    focus(options?: FocusOptions) {
+        this.wrapperRef.current!.focus(options);
+    }
+
+    render() {
+        return <div tabIndex={0} ref={this.wrapperRef} />;
+    }
+}
+
+describe('Focus candidate', () => {
+    let elementStructure: MountedComponent<HTMLDivElement>;
+    const refs = {
+        testElement: createRef<HTMLDivElement>(),
+        testComponent1: createRef<MockComponent>(),
+        testComponent2: createRef<MockComponent>(),
+    };
+
+    beforeEach(() => {
+        elementStructure = shallow<HTMLDivElement>(
+            <div tabIndex={0}>
+                <div
+                    ref={refs.testElement}
+                    tabIndex={0}
+                    className="test-element"
+                />
+                <MockComponent ref={refs.testComponent1} />
+                <MockComponent ref={refs.testComponent2} />
+            </div>,
+        );
+    });
+
+    afterEach(() => {
+        jest.clearAllMocks();
+        clearCandidateStack();
+        elementStructure.unmount();
+    });
+
+    it('should register a candidate', () => {
+        refs.testElement.current!.focus();
+        setActiveElementAsFocusCandidate();
+        expect(getLastCandidate()).toBe(refs.testElement.current!);
+    });
+
+    it('should register a manual candidate', () => {
+        setFocusCandidate(refs.testComponent1.current!);
+        expect(getLastCandidate()).toBe(refs.testComponent1.current!);
+    });
+
+    it('should register the next candidate', () => {
+        setNextFocusCandidate(refs.testComponent1.current!);
+        expect(getLastCandidate()).toBe(refs.testComponent1.current!);
+    });
+
+    it('should not register the same candidates twice', () => {
+        refs.testElement.current!.focus();
+        setActiveElementAsFocusCandidate();
+        setActiveElementAsFocusCandidate();
+        expect(getCandidateStack()).toEqual([
+            refs.testElement.current!,
+        ]);
+    });
+
+    it('should the focus candidate', () => {
+        elementStructure.ref().focus();
+        setActiveElementAsFocusCandidate();
+        refs.testElement.current!.focus();
+        focusCandidate();
+        expect(document.activeElement).toBe(elementStructure.ref());
+    });
+
+    it('should fill and pop the candidate stack properly', () => {
+        elementStructure.ref().focus();
+        setActiveElementAsFocusCandidate();
+        refs.testElement.current!.focus();
+        setActiveElementAsFocusCandidate();
+        refs.testComponent1.current!.focus();
+        setActiveElementAsFocusCandidate();
+        refs.testComponent2.current!.focus();
+        setActiveElementAsFocusCandidate();
+        expect(getCandidateStack()).toEqual([
+            elementStructure.ref(),
+            refs.testElement.current!,
+            refs.testComponent1.current!.wrapperRef.current!,
+            refs.testComponent2.current!.wrapperRef.current!,
+        ]);
+        // the last registered is skipped, because it's the current activeElement
+        // so the method should be called only 3x
+        focusCandidate();
+        focusCandidate();
+        focusCandidate();
+        expect(getCandidateStack()).toEqual([]);
+    });
+
+    it('should focus candidates during stack popping', () => {
+        elementStructure.ref().focus();
+        setActiveElementAsFocusCandidate();
+        refs.testElement.current!.focus();
+        setActiveElementAsFocusCandidate();
+        refs.testComponent1.current!.focus();
+        setActiveElementAsFocusCandidate();
+        refs.testComponent2.current!.focus();
+        focusCandidate();
+        expect(document.activeElement).toBe(refs.testComponent1.current!.wrapperRef.current!);
+        focusCandidate();
+        expect(document.activeElement).toBe(refs.testElement.current!);
+        focusCandidate();
+        expect(document.activeElement).toBe(elementStructure.ref());
+    });
+
+    it('should work with the next candidate', () => {
+        elementStructure.ref().focus();
+        setActiveElementAsFocusCandidate();
+        setNextFocusCandidate(refs.testElement.current!);
+        refs.testElement.current!.focus();
+        focusCandidate();
+        expect(document.activeElement).toBe(elementStructure.ref());
+    });
+
+    it('should work with the candidate as a component', () => {
+        refs.testComponent1.current!.focus();
+        setNextFocusCandidate(refs.testComponent1.current!);
+        refs.testComponent2.current!.focus();
+        setNextFocusCandidate(refs.testComponent2.current!);
+        expect(getCandidateStack()).toEqual([
+            refs.testComponent1.current!,
+            refs.testComponent2.current!,
+        ]);
+        // last candidate shoul'd not be focused
+        // because last focused candidate can't be currently focused element
+        focusCandidate();
+        expect(document.activeElement).toBe(refs.testComponent1.current!.wrapperRef.current!);
+    });
+
+    it('should work with the candidate as a reference', () => {
+        refs.testComponent1.current!.focus();
+        setNextFocusCandidate(refs.testComponent1);
+        refs.testComponent2.current!.focus();
+        setNextFocusCandidate(refs.testComponent2);
+        expect(getCandidateStack()).toEqual([
+            refs.testComponent1,
+            refs.testComponent2,
+        ]);
+        focusCandidate();
+        expect(document.activeElement).toBe(refs.testComponent1.current!.wrapperRef.current!);
+    });
+
+    it('should work with the candidate as multiple types and focus only unique elements', () => {
+        refs.testElement.current!.focus();
+        setActiveElementAsFocusCandidate();
+        refs.testComponent1.current!.focus();
+        setNextFocusCandidate(refs.testComponent1);
+        refs.testComponent2.current!.focus();
+        setNextFocusCandidate(refs.testComponent2.current!);
+        expect(getCandidateStack()).toEqual([
+            refs.testElement.current!,
+            refs.testComponent1,
+            refs.testComponent2.current!,
+        ]);
+        focusCandidate();
+        expect(document.activeElement).toBe(refs.testComponent1.current!.wrapperRef.current!);
+        focusCandidate();
+        expect(document.activeElement).toBe(refs.testElement.current!);
+    });
+
+    it('should work with the next candidate as a component', () => {
+        refs.testComponent1.current!.focus();
+        setFocusCandidate(refs.testComponent1.current!);
+        refs.testComponent2.current!.focus();
+        setNextFocusCandidate(refs.testComponent2.current!);
+        expect(getCandidateStack()).toEqual([
+            refs.testComponent1.current!,
+            refs.testComponent2.current!,
+        ]);
+        focusCandidate();
+        expect(document.activeElement).toBe(refs.testComponent1.current!.wrapperRef.current!);
+    });
+
+    it('should not focus an unavailable candidate', () => {
+        elementStructure.ref().focus();
+        setActiveElementAsFocusCandidate();
+        refs.testElement.current!.focus();
+        setActiveElementAsFocusCandidate();
+        refs.testComponent1.current!.focus();
+        setFocusCandidate(refs.testComponent1.current!);
+
+        refs.testElement.current!.style.display = 'none';
+        removeNode(refs.testComponent1.current!.wrapperRef);
+
+        focusCandidate();
+        expect(document.activeElement).toBe(elementStructure.ref());
+    });
+
+    it('should set and work with a candidate fallback', () => {
+        setCandidateFallback(elementStructure.ref());
+
+        refs.testElement.current!.focus();
+        setActiveElementAsFocusCandidate();
+        refs.testComponent1.current!.focus();
+        setActiveElementAsFocusCandidate();
+        refs.testComponent2.current!.focus();
+        setActiveElementAsFocusCandidate();
+
+        refs.testElement.current!.style.display = 'none';
+        removeNode(refs.testComponent1.current!.wrapperRef);
+        removeNode(refs.testComponent2.current!.wrapperRef);
+
+        focusCandidate();
+        expect(document.activeElement).toBe(elementStructure.ref());
+    });
+
+    it('should clear the candidate stack', () => {
+        elementStructure.ref().focus();
+        setActiveElementAsFocusCandidate();
+        refs.testElement.current!.focus();
+        setActiveElementAsFocusCandidate();
+        refs.testComponent1.current!.focus();
+        setActiveElementAsFocusCandidate();
+
+        expect(getCandidateStack()).toEqual([
+            elementStructure.ref(),
+            refs.testElement.current!,
+            refs.testComponent2.current!.wrapperRef.current!,
+        ]);
+
+        clearCandidateStack();
+
+        expect(getCandidateStack()).toEqual([]);
+    });
+});

package/packages/focus/src/__test__/focusFirstExisting.spec.tsx

@@ -0,0 +1,21 @@
+import { focusFirstExisting } from '../focusFirstExisting';
+
+describe('focusFirstExisting', () => {
+    const mockFocus1 = jest.fn();
+    const mockFocus2 = jest.fn();
+
+    it('should properly focus references', () => {
+        focusFirstExisting(
+            { current: { focus: mockFocus1 } },
+            { current: { focus: mockFocus2 } },
+        )();
+        expect(mockFocus1).toHaveBeenCalledTimes(1);
+        expect(mockFocus2).toHaveBeenCalledTimes(0);
+        focusFirstExisting(
+            { current: null },
+            { current: { focus: mockFocus2 } },
+        )();
+        expect(mockFocus1).toHaveBeenCalledTimes(1);
+        expect(mockFocus2).toHaveBeenCalledTimes(1);
+    });
+});

package/packages/focus/src/__test__/refocusAfterHashChange.spec.tsx

@@ -0,0 +1,41 @@
+import { createRef } from '@24i/bigscreen-sdk/jsx';
+import { shallow } from '@24i/bigscreen-sdk/jsx/test-utils';
+import { refocusAfterHashChange } from '../refocusAfterHashChange';
+
+jest.useFakeTimers();
+
+describe('refocusAfterHashChange', () => {
+    const wrapper = createRef<HTMLDivElement>();
+    const elementInsideWrapper = createRef<HTMLDivElement>();
+    const elementOutsideWrapper = createRef<HTMLDivElement>();
+    shallow(
+        <div>
+            <div ref={wrapper}>
+                <div ref={elementInsideWrapper} tabIndex={0} />
+            </div>
+            <div ref={elementOutsideWrapper} tabIndex={0} />
+        </div>,
+    );
+
+    afterEach(() => {
+        jest.clearAllMocks();
+    });
+
+    it('should refocus active element inside wrapper', () => {
+        elementInsideWrapper.current!.focus();
+        const activeElement = document.activeElement as HTMLElement;
+        const spyOnFocus = jest.spyOn(activeElement, 'focus');
+        refocusAfterHashChange(wrapper);
+        jest.runAllTimers();
+        expect(spyOnFocus).toHaveBeenCalledTimes(1);
+    });
+
+    it('should not refocus active element outside wrapper', () => {
+        elementOutsideWrapper.current!.focus();
+        const activeElement = document.activeElement as HTMLElement;
+        const spyOnFocus = jest.spyOn(activeElement, 'focus');
+        refocusAfterHashChange(wrapper);
+        jest.runAllTimers();
+        expect(spyOnFocus).toHaveBeenCalledTimes(0);
+    });
+});

package/packages/focus/src/__test__/safeFocus.spec.tsx

@@ -0,0 +1,41 @@
+import { createRef } from '@24i/bigscreen-sdk/jsx';
+import { shallow } from '@24i/bigscreen-sdk/jsx/test-utils';
+import { safeFocus } from '../safeFocus';
+
+describe('safeFocus', () => {
+    const wrapperElement = createRef<HTMLDivElement>();
+    const element1 = createRef<HTMLDivElement>();
+    const element2 = createRef<HTMLDivElement>();
+    const testSafeFocus = safeFocus(wrapperElement);
+
+    shallow(
+        <div>
+            <div ref={wrapperElement} tabIndex={0}>
+                <div ref={element1} tabIndex={0} />
+            </div>
+            <div ref={element2} tabIndex={0} />
+        </div>,
+    );
+
+    it('should focus element when activeElement is inside of the wrapperElement', () => {
+        wrapperElement.current!.focus();
+        testSafeFocus(element1.current!);
+        expect(document.activeElement === element1.current!).toBeTruthy();
+        testSafeFocus(wrapperElement.current!);
+        expect(document.activeElement === wrapperElement.current!).toBeTruthy();
+    });
+
+    it('should focus element when activeElement is body', () => {
+        document.body.focus();
+        testSafeFocus(element1.current!);
+        expect(document.activeElement === element1.current!).toBeTruthy();
+    });
+
+    it('should not focus element when activeElement is outside of the wrapperElement', () => {
+        element2.current!.focus();
+        testSafeFocus(element1.current!);
+        expect(document.activeElement === element1.current!).toBeFalsy();
+        testSafeFocus(wrapperElement.current!);
+        expect(document.activeElement === wrapperElement.current!).toBeFalsy();
+    });
+});

package/packages/list/src/BasicList/BasicList.tsx

@@ -103,10 +103,7 @@ export class BasicList<T extends Item<U>, U>
 
     shouldShowMrcuForward = () => {
         const { visibleItems, data } = this.props;
-        return (
-            this.controller.scrollIndex < data.length - 1 - visibleItems + VISIBLE_ITEMS_OFFSET
-            && data.length > visibleItems - 2
-        );
+        return this.controller.scrollIndex < data.length - 1 - visibleItems + VISIBLE_ITEMS_OFFSET;
     };
 
     shouldShowMrcuBackward = () => this.controller.scrollIndex > 0;

package/packages/list/src/EdgeOffsetList/EdgeOffsetList.tsx

@@ -93,12 +93,11 @@ export class EdgeOffsetList<T extends Item<U>, U>
     };
 
     shouldShowMrcuForward = () => {
-        const { data, edgeOffset, visibleItems } = this.props;
+        const { edgeOffset, visibleItems } = this.props;
         const { scrollIndex } = this.controller;
-
+        const list = this.base.current!;
         return (
-            scrollIndex < data.length - visibleItems + VISIBLE_ITEMS_OFFSET - edgeOffset
-            && data.length > visibleItems - 2
+            scrollIndex < list.data.length - visibleItems + VISIBLE_ITEMS_OFFSET - edgeOffset
         );
     };
 

package/packages/list/src/FirstOnlyList/FirstOnlyList.tsx

@@ -70,9 +70,9 @@ export class FirstOnlyList<T extends Item<U>, U>
     };
 
     shouldShowMrcuForward = () => {
-        const { data, visibleItems } = this.props;
+        const { data } = this.props;
         const list = this.base.current!;
-        return list.index < data.length - 1 && data.length > visibleItems - 2;
+        return list.index < data.length - 1;
     };
 
     shouldShowMrcuBackward = () => {

package/packages/list/src/FirstOnlyVariedList/FirstOnlyVariedList.tsx

@@ -80,9 +80,9 @@ export class FirstOnlyVariedList<T extends Item<U>, U> extends Component<Props<T
     };
 
     shouldShowMrcuForward = () => {
-        const { data, visibleItems } = this.props;
+        const { data } = this.props;
         const list = this.base.current!;
-        return list.index < data.length - 1 && data.length > visibleItems - 2;
+        return list.index < data.length - 1;
     };
 
     shouldShowMrcuBackward = () => {

package/packages/list/src/FixedToEndList/FixedToEndList.tsx

@@ -76,9 +76,9 @@ export class FixedToEndList<T extends Item<U>, U>
     };
 
     shouldShowMrcuForward = () => {
-        const { data, visibleItems } = this.props;
+        const { visibleItems } = this.props;
         const list = this.base.current!;
-        return list.index <= data.length - visibleItems + 1 && data.length > visibleItems - 2;
+        return list.index <= list.data.length - visibleItems + 1;
     };
 
     shouldShowMrcuBackward = () => this.controller.scrollIndex > 0;

package/packages/logger/README.md

@@ -55,7 +55,7 @@ the output would be:
 ## Logger Manager
 
 Logger Manager is used for managing loggers. We are able to add individual loggers to the Logger Manager and perform various operations on them.
-All loggers that we want to add to the Logger Manager should inherit from the [LoggerBase](./src/loggers/LoggerBase/README) abstract class.
+All loggers that we want to add to the Logger Manager should inherit from the [LoggerBase](./src/loggers/LoggerBase/README.md) abstract class.
 
 ### Methods
 

package/packages/mouse-navigation/src/__test__/MouseElementWrapper.spec.tsx

@@ -0,0 +1,61 @@
+import { createRef } from '@24i/bigscreen-sdk/jsx';
+import { getKeyMap } from '@24i/bigscreen-sdk/device';
+import { MountedComponent, shallow, keydown } from '@24i/bigscreen-sdk/jsx/test-utils';
+import { MouseElementWrapper } from '../MouseElementWrapper';
+import { MouseNavigationInterface } from '../MouseNavigationInterface';
+
+describe('MouseElementWrapper', () => {
+    const mPointRef = createRef<HTMLDivElement>();
+    let root: MountedComponent<HTMLDivElement>;
+    let nav: MountedComponent<MouseElementWrapper>;
+
+    beforeEach(() => {
+        jest.clearAllMocks();
+        root = shallow(<div className="mounting-point" ref={mPointRef} />);
+        nav = shallow(
+            <>
+                <MouseElementWrapper
+                    getMountingPoint={() => mPointRef}
+                >
+                    <div className="test-child" />
+                </MouseElementWrapper>
+            </>,
+        );
+    });
+
+    afterEach(() => {
+        nav.unmount();
+        root.unmount();
+    });
+
+    it('should not render child immediately', () => {
+        expect(root.find('.test-child')).toBe(null);
+    });
+
+    it('should handle key event correctly', () => {
+
+        const event = new MouseEvent('mousemove', {});
+        document.dispatchEvent(event);
+
+        expect(root.find('.mounting-point').firstElementChild)
+            .toBe(nav.ref().domRef.current);
+
+        keydown(document, getKeyMap().UP!);
+        expect(root.find('.mounting-point').firstElementChild).toBe(null);
+    });
+
+    it('should handle interface request to hide', () => {
+        const event = new MouseEvent('mousemove', {});
+        document.dispatchEvent(event);
+
+        expect(root.find('.mounting-point').firstElementChild)
+            .toBe(nav.ref().domRef.current);
+
+        MouseNavigationInterface.hide();
+        expect(root.find('.mounting-point').firstElementChild).toBe(null);
+
+        MouseNavigationInterface.show();
+        expect(root.find('.mounting-point').firstElementChild)
+            .toBe(nav.ref().domRef.current);
+    });
+});

package/packages/mouse-navigation/src/__test__/MouseNavigation.spec.tsx

@@ -0,0 +1,107 @@
+import { createRef } from '@24i/bigscreen-sdk/jsx';
+import { getKeyMap } from '@24i/bigscreen-sdk/device';
+import { MountedComponent, shallow, keydown } from '@24i/bigscreen-sdk/jsx/test-utils';
+import { MouseNavigation } from '../MouseNavigation';
+import { MouseNavigationInterface } from '../MouseNavigationInterface';
+
+const forwardMock = jest.fn();
+const backwardMock = jest.fn();
+const showForwardMock = jest.fn(() => true);
+const showBackwardMock = jest.fn(() => true);
+
+describe('MouseNavigation', () => {
+    const mPointRef = createRef<HTMLDivElement>();
+    let nav: MountedComponent<MouseNavigation>;
+
+    beforeEach(() => {
+        nav = shallow(
+            <MouseNavigation
+                getMountingPoint={() => mPointRef}
+                direction="vertical"
+                forward={forwardMock}
+                backward={backwardMock}
+                shouldShowMrcuForward={showForwardMock}
+                shouldShowMrcuBackward={showBackwardMock}
+            >
+                <>
+                    <div className="test-child" />
+                    <div className="mounting-point" ref={mPointRef} />
+                </>
+            </MouseNavigation>,
+        );
+    });
+
+    afterEach(() => {
+        nav.unmount();
+    });
+
+    it('should handle key event correctly', () => {
+
+        const event = new MouseEvent('mousemove', {});
+        document.dispatchEvent(event);
+
+        expect(nav.find('.mounting-point').firstElementChild)
+            .toBe(nav.ref().arrows.current?.domRef.current);
+
+        keydown(document, getKeyMap().UP!);
+
+        expect(nav.find('.mounting-point').firstElementChild).toBe(null);
+    });
+
+    it('should render child', () => {
+        expect(nav.find('.test-child').className).not.toBe(null);
+    });
+
+    it('should return correct mapped direction', () => {
+        expect(nav.ref().mapDirectionToProps('horizontal').horizontal).toBe(true);
+        expect(nav.ref().mapDirectionToProps('vertical').vertical).toBe(true);
+    });
+
+    it('should handle interface request to hide', () => {
+        const event = new MouseEvent('mousemove', {});
+        document.dispatchEvent(event);
+
+        expect(nav.find('.mounting-point').firstElementChild)
+            .toBe(nav.ref().arrows.current?.domRef.current);
+
+        MouseNavigationInterface.hide();
+
+        expect(nav.find('.mounting-point').firstElementChild).toBe(null);
+
+        MouseNavigationInterface.show();
+
+        expect(nav.find('.mounting-point').firstElementChild)
+            .toBe(nav.ref().arrows.current?.domRef.current);
+    });
+
+    it('should propagate forward and backward', () => {
+        nav.ref().handleArrowState = jest.fn();
+        nav.ref().forward();
+        nav.ref().backward();
+
+        expect(forwardMock).toHaveBeenCalledTimes(1);
+        expect(backwardMock).toHaveBeenCalledTimes(1);
+        expect(nav.ref().handleArrowState).toHaveBeenCalledTimes(2);
+    });
+
+    it('should show/hide arrows as reported', () => {
+        nav.ref().arrows = {
+            current: {
+                enableArrow: jest.fn(),
+                disableArrow: jest.fn(),
+            },
+        } as any;
+
+        nav.ref().handleArrowState();
+        expect(nav.ref().arrows.current?.enableArrow).toHaveBeenNthCalledWith(1, 'down');
+        expect(nav.ref().arrows.current?.enableArrow).toHaveBeenNthCalledWith(2, 'up');
+        expect(nav.ref().arrows.current?.enableArrow).toHaveBeenCalledTimes(2);
+
+        showForwardMock.mockImplementationOnce(() => false);
+        showBackwardMock.mockImplementationOnce(() => false);
+        nav.ref().handleArrowState();
+        expect(nav.ref().arrows.current?.disableArrow).toHaveBeenNthCalledWith(1, 'down');
+        expect(nav.ref().arrows.current?.disableArrow).toHaveBeenNthCalledWith(2, 'up');
+        expect(nav.ref().arrows.current?.disableArrow).toHaveBeenCalledTimes(2);
+    });
+});

package/packages/scroll-text/src/Base.tsx

@@ -78,10 +78,6 @@ export class ScrollTextBase extends Component<Props> implements IFocusable {
         if (processed) stopEvent(event);
     };
 
-    onMouseEnter = () => {
-        this.focus({ preventScroll: true });
-    };
-
     updateArrowNavigation(enable: boolean) {
         if (enable) {
             removeClass(this.arrowNavRef.current!.domRef, DISABLED_CLASS);
@@ -122,7 +118,6 @@ export class ScrollTextBase extends Component<Props> implements IFocusable {
                 className={className}
                 ref={this.domRef}
                 onKeyDown={this.onKeyDown}
-                onMouseEnter={this.onMouseEnter}
                 tabIndex={0}
             >
                 <Scroller