From 7971755e18623c37b410adff7035363f215fdccf Mon Sep 17 00:00:00 2001 From: Sebastian Malton Date: Tue, 10 Jan 2023 08:30:49 -0500 Subject: [PATCH] Cleanup uses and overrides of requestAnimationFrame Signed-off-by: Sebastian Malton --- .../terminal/opening-terminal-tab.test.tsx | 6 ------ src/jest.setup.ts | 7 +++++++ ...on-frame.global-override-for-injectable.ts | 9 +++++++++ .../components/tooltip/tooltip.test.tsx | 17 ---------------- src/renderer/components/tooltip/tooltip.tsx | 20 ++++++++++++++++--- src/renderer/getDiForUnitTesting.tsx | 3 --- 6 files changed, 33 insertions(+), 29 deletions(-) create mode 100644 src/renderer/components/animate/request-animation-frame.global-override-for-injectable.ts diff --git a/src/features/terminal/opening-terminal-tab.test.tsx b/src/features/terminal/opening-terminal-tab.test.tsx index 3f6fb6ce3e..1244543d08 100644 --- a/src/features/terminal/opening-terminal-tab.test.tsx +++ b/src/features/terminal/opening-terminal-tab.test.tsx @@ -27,12 +27,6 @@ describe("test for opening terminal tab within cluster frame", () => { setupInitializingApplicationBuilder(b => builder = b); - beforeAll(() => { - jest.spyOn(window, "requestAnimationFrame").mockImplementation(function IAmAMockRequestAnimationFrame(cb) { - return window.setTimeout(() => cb(Date.now())); - }); - }); - beforeEach(async () => { builder.mainDi.override(createKubeconfigManagerInjectable, () => (cluster) => { return { diff --git a/src/jest.setup.ts b/src/jest.setup.ts index 73b741dee4..0f470046cc 100644 --- a/src/jest.setup.ts +++ b/src/jest.setup.ts @@ -74,6 +74,13 @@ Object.defineProperty(window, "matchMedia", { })), }); +/** + * This is needed for getting XTermJs to work in tests + */ +jest.spyOn(window, "requestAnimationFrame").mockImplementation(function (cb) { + return window.setTimeout(() => cb(Date.now())); +}); + const getInjectables = (environment: "renderer" | "main", filePathGlob: string) => [ ...glob.sync(`./{common,extensions,${environment}}/**/${filePathGlob}`, { cwd: __dirname, diff --git a/src/renderer/components/animate/request-animation-frame.global-override-for-injectable.ts b/src/renderer/components/animate/request-animation-frame.global-override-for-injectable.ts new file mode 100644 index 0000000000..be3ed9e3d1 --- /dev/null +++ b/src/renderer/components/animate/request-animation-frame.global-override-for-injectable.ts @@ -0,0 +1,9 @@ +/** + * Copyright (c) OpenLens Authors. All rights reserved. + * Licensed under MIT License. See LICENSE in root directory for more information. + */ + +import { getGlobalOverride } from "../../../common/test-utils/get-global-override"; +import requestAnimationFrameInjectable from "./request-animation-frame.injectable"; + +export default getGlobalOverride(requestAnimationFrameInjectable, () => (cb) => window.setTimeout(() => cb())); diff --git a/src/renderer/components/tooltip/tooltip.test.tsx b/src/renderer/components/tooltip/tooltip.test.tsx index 6c8331be8a..0f51e5b2f1 100644 --- a/src/renderer/components/tooltip/tooltip.test.tsx +++ b/src/renderer/components/tooltip/tooltip.test.tsx @@ -10,23 +10,6 @@ import React from "react"; import { Tooltip } from "./tooltip"; describe("", () => { - let requestAnimationFrameSpy: jest.SpyInstance; - - beforeEach(() => { - requestAnimationFrameSpy = jest.spyOn(window, "requestAnimationFrame"); - - requestAnimationFrameSpy.mockImplementation(cb => { - cb(0); - - return 0; - }); - }); - - afterEach(() => { - requestAnimationFrameSpy.mockRestore(); - }); - - it("does not render to DOM if not visibile", () => { const result = render(( <> diff --git a/src/renderer/components/tooltip/tooltip.tsx b/src/renderer/components/tooltip/tooltip.tsx index 7fc1abddbf..12be968f70 100644 --- a/src/renderer/components/tooltip/tooltip.tsx +++ b/src/renderer/components/tooltip/tooltip.tsx @@ -11,6 +11,9 @@ import { observer } from "mobx-react"; import type { IClassName } from "../../utils"; import { cssNames, autoBind } from "../../utils"; import { observable, makeObservable, action } from "mobx"; +import type { RequestAnimationFrame } from "../animate/request-animation-frame.injectable"; +import { withInjectables } from "@ogre-tools/injectable-react"; +import requestAnimationFrameInjectable from "../animate/request-animation-frame.injectable"; export enum TooltipPosition { TOP = "top", @@ -49,8 +52,12 @@ const defaultProps: Partial = { offset: 10, }; +interface Dependencies { + requestAnimationFrame: RequestAnimationFrame; +} + @observer -export class Tooltip extends React.Component { +class NonInjectedTooltip extends React.Component { static defaultProps = defaultProps as object; @observable.ref elem: HTMLDivElement | null = null; @@ -58,7 +65,7 @@ export class Tooltip extends React.Component { @observable isVisible = false; @observable isContentVisible = false; // animation manager - constructor(props: TooltipProps) { + constructor(props: TooltipProps & Dependencies) { super(props); makeObservable(this); autoBind(this); @@ -94,7 +101,7 @@ export class Tooltip extends React.Component { @action protected onEnterTarget() { this.isVisible = true; - requestAnimationFrame(action(() => this.isContentVisible = true)); + this.props.requestAnimationFrame(action(() => this.isContentVisible = true)); } @action @@ -240,3 +247,10 @@ export class Tooltip extends React.Component { return tooltip; } } + +export const Tooltip = withInjectables(NonInjectedTooltip, { + getProps: (di, props) => ({ + ...props, + requestAnimationFrame: di.inject(requestAnimationFrameInjectable), + }), +}); diff --git a/src/renderer/getDiForUnitTesting.tsx b/src/renderer/getDiForUnitTesting.tsx index 2696d26d41..8a1a42abf2 100644 --- a/src/renderer/getDiForUnitTesting.tsx +++ b/src/renderer/getDiForUnitTesting.tsx @@ -11,7 +11,6 @@ import requestFromChannelInjectable from "./utils/channel/request-from-channel.i import { getOverrideFsWithFakes } from "../test-utils/override-fs-with-fakes"; import hostedClusterIdInjectable from "./cluster-frame-context/hosted-cluster-id.injectable"; import { runInAction } from "mobx"; -import requestAnimationFrameInjectable from "./components/animate/request-animation-frame.injectable"; import { registerMobX } from "@ogre-tools/injectable-extension-for-mobx"; import legacyOnChannelListenInjectable from "./ipc/legacy-channel-listen.injectable"; import type { GlobalOverride } from "../common/test-utils/get-global-override"; @@ -62,8 +61,6 @@ export const getDiForUnitTesting = ( di.override(legacyOnChannelListenInjectable, () => () => noop); - di.override(requestAnimationFrameInjectable, () => (callback) => callback()); - di.override(requestFromChannelInjectable, () => () => Promise.resolve(undefined as never)); getOverrideFsWithFakes()(di);