IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Chore: Refactor scroll-page.test.js to TypeScript (#59617)

Browse Source
This commit is contained in:
Hamas Shafiq 2022-12-13 10:17:28 +00:00 committed by GitHub
parent af7d293eaf
commit eaf96081d2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 41 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/jaeger-ui-components/src/Tween.test.ts
View File

@ -189,8 +189,8 @@ describe('Tween', () => {
it('releases references to callbacks', () => {
const tween = new Tween({ ...baseOptions, onComplete: () => {}, onUpdate: () => {} });
tween.cancel();
expect(tween.callbackComplete).toBe(undefined);
expect(tween.callbackUpdate).toBe(undefined);
expect(tween.onComplete).toBe(undefined);
expect(tween.onUpdate).toBe(undefined);
});
});
});

30
packages/jaeger-ui-components/src/Tween.tsx
View File

@ -23,7 +23,7 @@ export interface TweenState {
type TTweenCallback = (state: TweenState) => void;
type TTweenOptions = {
export type TTweenOptions = {
delay?: number;
duration: number;
from: number;
@ -33,8 +33,8 @@ type TTweenOptions = {
};
export default class Tween {
callbackComplete: TTweenCallback | TNil;
callbackUpdate: TTweenCallback | TNil;
onComplete: TTweenCallback | TNil;
onUpdate: TTweenCallback | TNil;
delay: number | TNil;
duration: number;
from: number;
@ -49,13 +49,13 @@ export default class Tween {
this.from = from;
this.to = to;
if (!onUpdate && !onComplete) {
this.callbackComplete = undefined;
this.callbackUpdate = undefined;
this.onComplete = undefined;
this.onUpdate = undefined;
this.timeoutID = undefined;
this.requestID = undefined;
} else {
this.callbackComplete = onComplete;
this.callbackUpdate = onUpdate;
this.onComplete = onComplete;
this.onUpdate = onUpdate;
if (delay) {
// setTimeout from @types/node returns NodeJS.Timeout, so prefix with `window.`
this.timeoutID = window.setTimeout(this._frameCallback, delay);
@ -71,15 +71,15 @@ export default class Tween {
this.timeoutID = undefined;
this.requestID = undefined;
const current = Object.freeze(this.getCurrent());
if (this.callbackUpdate) {
this.callbackUpdate(current);
if (this.onUpdate) {
this.onUpdate(current);
}
if (this.callbackComplete && current.done) {
this.callbackComplete(current);
if (this.onComplete && current.done) {
this.onComplete(current);
}
if (current.done) {
this.callbackComplete = undefined;
this.callbackUpdate = undefined;
this.onComplete = undefined;
this.onUpdate = undefined;
} else {
this.requestID = window.requestAnimationFrame(this._frameCallback);
}
@ -94,8 +94,8 @@ export default class Tween {
window.cancelAnimationFrame(this.requestID);
this.requestID = undefined;
}
this.callbackComplete = undefined;
this.callbackUpdate = undefined;
this.onComplete = undefined;
this.onUpdate = undefined;
}
getCurrent(): TweenState {

53
packages/jaeger-ui-components/src/scroll-page.test.js → packages/jaeger-ui-components/src/scroll-page.test.ts
View File

@ -19,20 +19,15 @@ import { scrollBy, scrollTo, cancel } from './scroll-page';
// keep track of instances, manually
// https://github.com/facebook/jest/issues/5019
const tweenInstances = [];
const tweenInstances: Tween[] = [];
describe('scroll-by', () => {
beforeEach(() => {
window.scrollY = 100;
tweenInstances.length = 0;
Tween.mockClear();
Tween.mockImplementation((opts) => {
const rv = { to: opts.to, onUpdate: opts.onUpdate };
Object.keys(Tween.prototype).forEach((name) => {
if (name !== 'constructor') {
rv[name] = jest.fn();
}
});
jest.mocked(Tween).mockClear();
jest.mocked(Tween).mockImplementation((opts) => {
const rv = { to: opts.to, onUpdate: opts.onUpdate, cancel: jest.fn(), getCurrent: jest.fn() } as unknown as Tween;
tweenInstances.push(rv);
return rv;
});
@ -48,7 +43,7 @@ describe('scroll-by', () => {
const yDelta = 10;
scrollBy(yDelta);
const spec = expect.objectContaining({ to: window.scrollY + yDelta });
expect(Tween.mock.calls).toEqual([[spec]]);
expect(jest.mocked(Tween).mock.calls).toEqual([[spec]]);
});
});
@ -56,9 +51,9 @@ describe('scroll-by', () => {
it('is the same as `appendToLast === false` without an in-progress scroll', () => {
const yDelta = 10;
scrollBy(yDelta, true);
expect(Tween.mock.calls.length).toBe(1);
expect(jest.mocked(Tween).mock.calls.length).toBe(1);
scrollBy(yDelta, false);
expect(Tween.mock.calls[0]).toEqual(Tween.mock.calls[1]);
expect(jest.mocked(Tween).mock.calls[0]).toEqual(jest.mocked(Tween).mock.calls[1]);
});
it('is additive when an in-progress scroll is the same direction', () => {
@ -66,8 +61,8 @@ describe('scroll-by', () => {
const spec = expect.objectContaining({ to: window.scrollY + 2 * yDelta });
scrollBy(yDelta);
scrollBy(yDelta, true);
expect(Tween.mock.calls.length).toBe(2);
expect(Tween.mock.calls[1]).toEqual([spec]);
expect(jest.mocked(Tween).mock.calls.length).toBe(2);
expect(jest.mocked(Tween).mock.calls[1]).toEqual([spec]);
});
it('ignores the in-progress scroll is the other direction', () => {
@ -75,8 +70,8 @@ describe('scroll-by', () => {
const spec = expect.objectContaining({ to: window.scrollY - yDelta });
scrollBy(yDelta);
scrollBy(-yDelta, true);
expect(Tween.mock.calls.length).toBe(2);
expect(Tween.mock.calls[1]).toEqual([spec]);
expect(jest.mocked(Tween).mock.calls.length).toBe(2);
expect(jest.mocked(Tween).mock.calls[1]).toEqual([spec]);
});
});
});
@ -86,7 +81,7 @@ describe('scroll-by', () => {
const to = 10;
const spec = expect.objectContaining({ to });
scrollTo(to);
expect(Tween.mock.calls).toEqual([[spec]]);
expect(jest.mocked(Tween).mock.calls).toEqual([[spec]]);
});
it('ignores the in-progress scroll', () => {
@ -94,8 +89,8 @@ describe('scroll-by', () => {
const spec = expect.objectContaining({ to });
scrollTo(Math.random());
scrollTo(to);
expect(Tween.mock.calls.length).toBe(2);
expect(Tween.mock.calls[1]).toEqual([spec]);
expect(jest.mocked(Tween).mock.calls.length).toBe(2);
expect(jest.mocked(Tween).mock.calls[1]).toEqual([spec]);
});
});
@ -106,7 +101,7 @@ describe('scroll-by', () => {
expect(tweenInstances.length).toBe(1);
const tw = tweenInstances[0];
cancel();
expect(tw.cancel.mock.calls).toEqual([[]]);
expect(jest.mocked(tw.cancel).mock.calls).toEqual([[]]);
});
it('is a noop if there is not an in-progress scroll', () => {
@ -115,16 +110,16 @@ describe('scroll-by', () => {
expect(tweenInstances.length).toBe(1);
const tw = tweenInstances[0];
cancel();
expect(tw.cancel.mock.calls).toEqual([[]]);
tw.cancel.mockReset();
expect(jest.mocked(tw.cancel).mock.calls).toEqual([[]]);
jest.mocked(tw.cancel).mockReset();
// now, we check to see if `cancel()` has an effect on the last created tween
cancel();
expect(tw.cancel.mock.calls.length).toBe(0);
expect(jest.mocked(tw.cancel).mock.calls.length).toBe(0);
});
});
describe('_onTweenUpdate', () => {
let oldScrollTo;
let oldScrollTo: { (options?: ScrollToOptions | undefined): void; (x: number, y: number): void };
beforeEach(() => {
oldScrollTo = window.scrollTo;
@ -140,19 +135,19 @@ describe('scroll-by', () => {
// cause a `Tween` to be created to get a reference to _onTweenUpdate
scrollTo(10);
const { onUpdate } = tweenInstances[0];
onUpdate({ value, done: false });
expect(window.scrollTo.mock.calls.length).toBe(1);
expect(window.scrollTo.mock.calls[0][1]).toBe(value);
onUpdate?.({ value, done: false });
expect(jest.mocked(window.scrollTo).mock.calls.length).toBe(1);
expect(jest.mocked(window.scrollTo).mock.calls[0][1]).toBe(value);
});
it('discards the in-progress scroll if the scroll is done', () => {
// cause a `Tween` to be created to get a reference to _onTweenUpdate
scrollTo(10);
const { onUpdate, cancel: twCancel } = tweenInstances[0];
onUpdate({ value: 123, done: true });
onUpdate?.({ value: 123, done: true });
// if the tween is not discarded, `cancel()` will cancel it
cancel();
expect(twCancel.mock.calls.length).toBe(0);
expect(jest.mocked(twCancel).mock.calls.length).toBe(0);
});
});
});