diff --git a/packages/core/src/commands/registry.ts b/packages/core/src/commands/registry.ts index c2fb1cd80..28df20095 100644 --- a/packages/core/src/commands/registry.ts +++ b/packages/core/src/commands/registry.ts @@ -17,6 +17,7 @@ import type { ExportTemplateCommandRegistryRun, ExportTemplateCommandRegistrySto import type { OpenAssetsCommandRegistryRun, OpenAssetsCommandRegistryStop } from './view/OpenAssets'; import type { OpenLayersCommandRegistryRun, OpenLayersCommandRegistryStop } from './view/OpenLayers'; import type { OpenBlocksCommandRegistryRun, OpenBlocksCommandRegistryStop } from './view/OpenBlocks'; +import type { SwitchVisibilityCommandRegistryRun, SwitchVisibilityCommandRegistryStop } from './view/SwitchVisibility'; import type { OpenStyleManagerCommandRegistryRun, OpenStyleManagerCommandRegistryStop, @@ -46,7 +47,8 @@ export interface CommandRegistryRun OpenBlocksCommandRegistryRun, OpenLayersCommandRegistryRun, OpenStyleManagerCommandRegistryRun, - OpenTraitManagerCommandRegistryRun {} + OpenTraitManagerCommandRegistryRun, + SwitchVisibilityCommandRegistryRun {} export interface CommandRegistryStop extends FullscreenCommandRegistryStop, @@ -58,7 +60,8 @@ export interface CommandRegistryStop OpenBlocksCommandRegistryStop, OpenLayersCommandRegistryStop, OpenStyleManagerCommandRegistryStop, - OpenTraitManagerCommandRegistryStop {} + OpenTraitManagerCommandRegistryStop, + SwitchVisibilityCommandRegistryStop {} export type CommandRunKnownId = Extract; export type CommandStopKnownId = Extract; diff --git a/packages/core/src/commands/view/SwitchVisibility.ts b/packages/core/src/commands/view/SwitchVisibility.ts index 3f6e0222f..960ea31d3 100644 --- a/packages/core/src/commands/view/SwitchVisibility.ts +++ b/packages/core/src/commands/view/SwitchVisibility.ts @@ -1,21 +1,32 @@ import { bindAll } from 'underscore'; import Frame from '../../canvas/model/Frame'; import Editor from '../../editor'; -import { CommandObject } from './CommandAbstract'; import { isDef } from '../../utils/mixins'; +import type { CommandPublicFnFromHandler } from '../registryHelpers'; +import CommandAbstract from './CommandAbstract'; -export default { +export interface SwitchVisibilityCommandRegistryRun { + 'core:component-outline': CommandPublicFnFromHandler; + 'sw-visibility': CommandPublicFnFromHandler; +} + +export interface SwitchVisibilityCommandRegistryStop { + 'core:component-outline': CommandPublicFnFromHandler; + 'sw-visibility': CommandPublicFnFromHandler; +} + +export default class CommandSwitchVisibility extends CommandAbstract { init() { bindAll(this, '_onFramesChange'); - }, + } - run(ed) { + run(ed: Editor) { this.toggleVis(ed, true); - }, + } - stop(ed) { + stop(ed: Editor) { this.toggleVis(ed, false); - }, + } toggleVis(ed: Editor, active = true) { if (!ed.Commands.isActive('preview')) { @@ -25,7 +36,7 @@ export default { canvasModel[mth]('change:frames', this._onFramesChange); this.handleFrames(cv.getFrames(), active); } - }, + } handleFrames(frames: Frame[], active?: boolean) { frames.forEach((frame: Frame & { __ol?: boolean }) => { @@ -36,11 +47,11 @@ export default { frame.__ol = true; } }); - }, + } _onFramesChange(_: any, frames: Frame[]) { this.handleFrames(frames); - }, + } _upFrame(frame: Frame, active?: boolean) { const { ppfx, em, id } = this; @@ -48,10 +59,5 @@ export default { const method = isActive ? 'add' : 'remove'; const cls = `${ppfx}dashed`; frame.view?.getBody().classList[method](cls); - }, -} as CommandObject< - {}, - { - [key: string]: any; } ->; +} diff --git a/packages/core/test/specs/commands/view/CanvasMove.ts b/packages/core/test/specs/commands/view/CanvasMove.ts index df2f720d1..79a6df88e 100644 --- a/packages/core/test/specs/commands/view/CanvasMove.ts +++ b/packages/core/test/specs/commands/view/CanvasMove.ts @@ -14,7 +14,7 @@ describe('CanvasMove command', () => { test('onKeyUp should stop the command on space key', () => { const command = new CanvasMove({}); - command.editor = { stopCommand: jest.fn() }; + command.editor = { stopCommand: jest.fn() } as any; command.id = 'core:canvas-move'; command.onKeyUp({ which: 32 } as KeyboardEvent); diff --git a/packages/core/test/specs/commands/view/CopyComponent.ts b/packages/core/test/specs/commands/view/CopyComponent.ts index d7feab5f6..72e0cb490 100644 --- a/packages/core/test/specs/commands/view/CopyComponent.ts +++ b/packages/core/test/specs/commands/view/CopyComponent.ts @@ -10,7 +10,7 @@ describe('CopyComponent command', () => { getSelectedAll: jest.fn(() => selected), }; - command.run(editor); + command.run(editor as any); expect(set).toHaveBeenCalledWith('clipboard', selected); }); @@ -29,7 +29,7 @@ describe('CopyComponent command', () => { getSelectedAll: jest.fn(() => [component]), }; - command.run(editor); + command.run(editor as any); expect(component.delegate.copy).toHaveBeenCalledWith(component); expect(set).toHaveBeenCalledWith('clipboard', [delegated]); diff --git a/packages/core/test/specs/commands/view/OpenAssets.ts b/packages/core/test/specs/commands/view/OpenAssets.ts index 7869c39d8..c076d01c1 100644 --- a/packages/core/test/specs/commands/view/OpenAssets.ts +++ b/packages/core/test/specs/commands/view/OpenAssets.ts @@ -4,34 +4,36 @@ describe('OpenAssets command', () => { test('open should open the modal', () => { const onceClose = jest.fn(); const command = new OpenAssets({}); - command.editor = { + const editor = { Modal: { open: jest.fn(() => ({ onceClose })), }, stopCommand: jest.fn(), } as any; + command.editor = editor; command.am = { __customData: jest.fn() }; command.config = { custom: false }; command.title = 'Assets'; command.open('content'); - expect(command.editor.Modal.open).toHaveBeenCalledWith({ title: 'Assets', content: 'content' }); + expect(editor.Modal.open).toHaveBeenCalledWith({ title: 'Assets', content: 'content' }); expect(onceClose).toHaveBeenCalledTimes(1); }); test('stop should close the modal', () => { const command = new OpenAssets({}); - command.editor = { + const editor = { Modal: { close: jest.fn(), }, } as any; + command.editor = editor; command.am = { __customData: jest.fn() }; command.config = { custom: false }; - command.stop(command.editor); + command.stop(editor); - expect(command.editor.Modal.close).toHaveBeenCalledTimes(1); + expect(editor.Modal.close).toHaveBeenCalledTimes(1); }); }); diff --git a/packages/core/test/specs/commands/view/OpenLayers.ts b/packages/core/test/specs/commands/view/OpenLayers.ts index 899b3606f..b89ef59e7 100644 --- a/packages/core/test/specs/commands/view/OpenLayers.ts +++ b/packages/core/test/specs/commands/view/OpenLayers.ts @@ -3,8 +3,8 @@ import OpenLayers from '../../../../src/commands/view/OpenLayers'; describe('OpenLayers command', () => { test('should show layers container when opened', () => { const command = new OpenLayers({}); - const trigger = jest.fn(() => ({ trigger })); - const panel = { set: jest.fn(() => ({ trigger })) }; + const panelTrigger = jest.fn(); + const panel = { set: jest.fn(() => ({ trigger: panelTrigger })) }; const render = jest.fn(() => document.createElement('div')); const editor = { LayerManager: { diff --git a/packages/core/test/specs/commands/view/SwitchVisibility.ts b/packages/core/test/specs/commands/view/SwitchVisibility.ts index 9b8cd6a9c..75832c0dc 100644 --- a/packages/core/test/specs/commands/view/SwitchVisibility.ts +++ b/packages/core/test/specs/commands/view/SwitchVisibility.ts @@ -4,13 +4,16 @@ describe('SwitchVisibility command', () => { let fakeEditor: any; let fakeFrames: any; let fakeIsActive: any; + let command: SwitchVisibility; beforeEach(() => { fakeFrames = []; fakeIsActive = false; + command = new SwitchVisibility({ em: { Commands: { isActive: jest.fn(() => false) } }, pStylePrefix: 'gjs-' }); fakeEditor = { Canvas: { + getModel: jest.fn(() => ({ on: jest.fn(), off: jest.fn() })), getFrames: jest.fn(() => fakeFrames), }, @@ -24,8 +27,25 @@ describe('SwitchVisibility command', () => { it('should do nothing if the preview command is active', () => { expect(fakeEditor.Canvas.getFrames).not.toHaveBeenCalled(); fakeIsActive = true; - SwitchVisibility.toggleVis(fakeEditor); + command.toggleVis(fakeEditor); expect(fakeEditor.Canvas.getFrames).not.toHaveBeenCalled(); }); + + it('should remove the dashed class on stop', () => { + const remove = jest.fn(); + fakeFrames = [ + { + view: { + loaded: true, + getBody: jest.fn(() => ({ classList: { add: jest.fn(), remove } })), + }, + on: jest.fn(), + }, + ]; + + command.stop(fakeEditor); + + expect(remove).toHaveBeenCalledWith('gjs-dashed'); + }); }); });