rob
/
clipper
2
0
Fork 0
Code Issues 11 Pull Requests 1 Projects Releases Wiki Activity

Add basic test coverage for viewport handling
continuous-integration/drone/push Build is passing Details

This commit is contained in:
Rob Watson 2022-02-05 09:16:31 +01:00
parent a8ba36a0e1
commit a0bb48fb69
1 changed files with 161 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

178
frontend/src/AppState.test.ts
View File

@ -2,7 +2,7 @@ import { MediaSet } from './generated/media_set';
import { stateReducer, State } from './AppState';
import { from } from 'rxjs';
import { PlayState } from './Player';
import { CanvasWidth } from './HudCanvasState';
import { CanvasWidth, SelectionMode } from './HudCanvasState';
const initialState: State = {
selection: { start: 0, end: 0 },
@ -22,29 +22,173 @@ describe('stateReducer', () => {
describe('mediasetloaded', () => {
describe.each([
{
name: 'with a normal length media set',
audioFrames: 4410000,
wantViewportFrames: 220500,
},
{
name: 'with a very short media set',
audioFrames: 44100,
wantViewportFrames: 2200,
},
])('mousedown', ({ name, audioFrames, wantViewportFrames }) => {
test(name, () => {
const mediaSet = MediaSet.fromPartial({
id: '123',
audioFrames: audioFrames,
])(
'mediaset with $audioFrames frames',
({ audioFrames, wantViewportFrames }) => {
it('generates the expected state', () => {
const mediaSet = MediaSet.fromPartial({
id: '123',
audioFrames: audioFrames,
});
const state = stateReducer(
{ ...initialState },
{ type: 'mediasetloaded', mediaSet: mediaSet }
);
expect(state.mediaSet).toBe(mediaSet);
expect(state.viewport.start).toEqual(0);
expect(state.viewport.end).toEqual(wantViewportFrames);
});
const state = stateReducer(
{ ...initialState },
{ type: 'mediasetloaded', mediaSet: mediaSet }
);
expect(state.mediaSet).toBe(mediaSet);
expect(state.viewport.start).toEqual(0);
expect(state.viewport.end).toEqual(wantViewportFrames);
});
});
}
);
});
describe('setviewport', () => {
describe.each([
{
audioFrames: 441000,
viewport: { start: 0, end: 44100 },
selection: { start: 0, end: 0 },
wantViewportCanvas: { x1: 0, x2: 200 },
wantSelectionCanvas: { x1: 0, x2: 0 },
},
{
audioFrames: 441000,
viewport: { start: 0, end: 441000 },
selection: { start: 0, end: 0 },
wantViewportCanvas: { x1: 0, x2: 2000 },
wantSelectionCanvas: { x1: 0, x2: 0 },
},
{
audioFrames: 441000,
viewport: { start: 0, end: 441000 },
selection: { start: 0, end: 44100 },
wantViewportCanvas: { x1: 0, x2: 2000 },
wantSelectionCanvas: { x1: 0, x2: 200 },
},
{
audioFrames: 441000,
viewport: { start: 0, end: 22050 },
selection: { start: 0, end: 44100 },
wantViewportCanvas: { x1: 0, x2: 100 },
wantSelectionCanvas: { x1: 0, x2: 2000 },
},
{
audioFrames: 441000,
viewport: { start: 44100, end: 88200 },
selection: { start: 22050, end: 66150 },
wantViewportCanvas: { x1: 200, x2: 400 },
wantSelectionCanvas: { x1: 0, x2: 1000 },
},
])(
'selection $selection.start-$selection.end, viewport: $viewport.start-$viewport.end',
({
audioFrames,
viewport,
selection,
wantViewportCanvas,
wantSelectionCanvas,
}) => {
it('generates the expected state', () => {
const mediaSet = MediaSet.fromPartial({
id: '123',
audioFrames: audioFrames,
});
const state = stateReducer(
{ ...initialState, mediaSet: mediaSet, selection: selection },
{ type: 'setviewport', viewport: viewport }
);
expect(state.viewport).toEqual(viewport);
expect(state.selection).toEqual(selection);
expect(state.viewportCanvas).toEqual(wantViewportCanvas);
expect(state.selectionCanvas).toEqual(wantSelectionCanvas);
});
}
);
});
describe('viewportchanged', () => {
describe.each([
{
audioFrames: 441000,
event: {
mode: SelectionMode.Selecting,
prevMode: SelectionMode.Selecting,
selection: { x1: 0, x2: 200 },
},
selection: { start: 0, end: 0 },
wantViewport: { start: 0, end: 441000 },
wantSelectionCanvas: { x1: 0, x2: 0 },
},
{
audioFrames: 441000,
event: {
mode: SelectionMode.Normal,
prevMode: SelectionMode.Selecting,
selection: { x1: 0, x2: 200 },
},
selection: { start: 0, end: 0 },
wantViewport: { start: 0, end: 44100 },
wantSelectionCanvas: { x1: 0, x2: 0 },
},
{
audioFrames: 441000,
event: {
mode: SelectionMode.Normal,
prevMode: SelectionMode.Selecting,
selection: { x1: 0, x2: 200 },
},
selection: { start: 0, end: 22050 },
wantViewport: { start: 0, end: 44100 },
wantSelectionCanvas: { x1: 0, x2: 1000 },
},
{
audioFrames: 441000,
event: {
mode: SelectionMode.Normal,
prevMode: SelectionMode.Selecting,
selection: { x1: 1000, x2: 1500 },
},
selection: { start: 220500, end: 264600 },
wantViewport: { start: 220500, end: 330750 },
wantSelectionCanvas: { x1: 0, x2: 800 },
},
])(
'mode $event.mode, audioFrames $audioFrames, canvas range $event.selection.x1-$event.selection.x2, selectedFrames $selection.start-$selection.end',
({
audioFrames,
event,
selection,
wantViewport,
wantSelectionCanvas,
}) => {
it('generates the expected state', () => {
const mediaSet = MediaSet.fromPartial({
id: '123',
audioFrames: audioFrames,
});
const state = stateReducer(
{
...initialState,
mediaSet: mediaSet,
viewport: { start: 0, end: audioFrames },
selection: selection,
},
{ type: 'viewportchanged', event }
);
expect(state.selection).toEqual(selection);
expect(state.viewport).toEqual(wantViewport);
expect(state.selectionCanvas).toEqual(wantSelectionCanvas);
});
}
);
});
});