From bef2ac41a0498cb299ad7e2da3f11cacfec5858e Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Fri, 5 Aug 2022 09:22:34 -0700 Subject: [PATCH] refactor: Remove uses of AnyDuringMigration and fix types in BlocklyOptions/Options. (#6315) --- core/blockly_options.ts | 17 +- core/options.ts | 249 +++++++---------------- core/renderers/common/block_rendering.ts | 3 +- core/theme.ts | 16 +- core/workspace_svg.ts | 2 +- 5 files changed, 100 insertions(+), 187 deletions(-) diff --git a/core/blockly_options.ts b/core/blockly_options.ts index e7d718e77..6f3c352a2 100644 --- a/core/blockly_options.ts +++ b/core/blockly_options.ts @@ -15,8 +15,9 @@ import * as goog from '../closure/goog/goog.js'; goog.declareModuleId('Blockly.BlocklyOptions'); -import {Theme} from './theme.js'; -import {Workspace} from './workspace.js'; +import type {Theme, ITheme} from './theme.js'; +import type {WorkspaceSvg} from './workspace_svg.js'; +import type {ToolboxDefinition} from './utils/toolbox.js'; /** @@ -26,7 +27,7 @@ import {Workspace} from './workspace.js'; export interface BlocklyOptions { collapse?: boolean; comments?: boolean; - cs?: boolean; + css?: boolean; disable?: boolean; grid?: GridOptions; horizontalLayout?: boolean; @@ -41,14 +42,14 @@ export interface BlocklyOptions { rtl?: boolean; scrollbars?: ScrollbarOptions|boolean; sounds?: boolean; - theme?: Theme; - toolbox?: string|object|Element; + theme?: Theme|string|ITheme; + toolbox?: string|ToolboxDefinition|Element; toolboxPosition?: string; trashcan?: boolean; - maxTrashcanContents?: boolean; - plugins?: object; + maxTrashcanContents?: number; + plugins?: {[key: string]: (new(...p1: any[]) => any)|string}; zoom?: ZoomOptions; - parentWorkspace?: Workspace; + parentWorkspace?: WorkspaceSvg; } export interface GridOptions { diff --git a/core/options.ts b/core/options.ts index 10ee76aa2..bf366ceda 100644 --- a/core/options.ts +++ b/core/options.ts @@ -43,7 +43,7 @@ export class Options { pathToMedia: string; hasCategories: boolean; moveOptions: MoveOptions; - hasScrollbars: AnyDuringMigration; + hasScrollbars: boolean; hasTrashcan: boolean; maxTrashcanContents: number; hasSounds: boolean; @@ -55,7 +55,7 @@ export class Options { toolboxPosition: toolbox.Position; theme: Theme; renderer: string; - rendererOverrides: AnyDuringMigration|null; + rendererOverrides: {[rendererConstant: string]: any}|null; /** * The SVG element for the grid pattern. @@ -63,10 +63,7 @@ export class Options { */ gridPattern: SVGElement|null = null; parentWorkspace: WorkspaceSvg|null; - plugins: { - [key: string]: (new(...p1: AnyDuringMigration[]) => AnyDuringMigration)| - string - }; + plugins: {[key: string]: (new(...p1: any[]) => any)|string}; /** * If set, sets the translation of the workspace to match the scrollbars. @@ -96,35 +93,27 @@ export class Options { let hasComments = false; let hasDisable = false; let hasSounds = false; - const readOnly = !!(options as AnyDuringMigration)['readOnly']; + const readOnly = !!options['readOnly']; if (!readOnly) { - toolboxJsonDef = toolbox.convertToolboxDefToJson( - (options as AnyDuringMigration)['toolbox']); + toolboxJsonDef = + toolbox.convertToolboxDefToJson(options['toolbox'] ?? null); hasCategories = toolbox.hasCategories(toolboxJsonDef); - hasTrashcan = (options as AnyDuringMigration)['trashcan']; - if (hasTrashcan === undefined) { - hasTrashcan = hasCategories; - } - hasCollapse = (options as AnyDuringMigration)['collapse']; - if (hasCollapse === undefined) { - hasCollapse = hasCategories; - } - hasComments = (options as AnyDuringMigration)['comments']; - if (hasComments === undefined) { - hasComments = hasCategories; - } - hasDisable = (options as AnyDuringMigration)['disable']; - if (hasDisable === undefined) { - hasDisable = hasCategories; - } - hasSounds = (options as AnyDuringMigration)['sounds']; - if (hasSounds === undefined) { - hasSounds = true; - } + const rawHasTrashcan = options['trashcan']; + hasTrashcan = + rawHasTrashcan === undefined ? hasCategories : rawHasTrashcan; + const rawHasCollapse = options['collapse']; + hasCollapse = + rawHasCollapse === undefined ? hasCategories : rawHasCollapse; + const rawHasComments = options['comments']; + hasComments = + rawHasComments === undefined ? hasCategories : rawHasComments; + const rawHasDisable = options['disable']; + hasDisable = rawHasDisable === undefined ? hasCategories : rawHasDisable; + const rawHasSounds = options['sounds']; + hasSounds = rawHasSounds === undefined ? true : rawHasSounds; } - let maxTrashcanContents = - (options as AnyDuringMigration)['maxTrashcanContents']; + let maxTrashcanContents = options['maxTrashcanContents']; if (hasTrashcan) { if (maxTrashcanContents === undefined) { maxTrashcanContents = 32; @@ -132,13 +121,12 @@ export class Options { } else { maxTrashcanContents = 0; } - const rtl = !!(options as AnyDuringMigration)['rtl']; - let horizontalLayout = (options as AnyDuringMigration)['horizontalLayout']; + const rtl = !!options['rtl']; + let horizontalLayout = options['horizontalLayout']; if (horizontalLayout === undefined) { horizontalLayout = false; } - let toolboxAtStart = (options as AnyDuringMigration)['toolboxPosition']; - toolboxAtStart = toolboxAtStart !== 'end'; + const toolboxAtStart = options['toolboxPosition'] !== 'end'; let toolboxPosition: toolbox.Position; if (horizontalLayout) { @@ -149,7 +137,7 @@ export class Options { toolbox.Position.LEFT; } - let hasCss = (options as AnyDuringMigration)['css']; + let hasCss = options['css']; if (hasCss === undefined) { hasCss = true; } @@ -157,20 +145,17 @@ export class Options { if (options['media']) { pathToMedia = options['media'].endsWith('/') ? options['media'] : options['media'] + '/'; - } else if ((options as AnyDuringMigration)['path']) { + } else if ('path' in options) { // 'path' is a deprecated option which has been replaced by 'media'. deprecation.warn('path', 'Nov 2014', 'Jul 2023', 'media'); - pathToMedia = (options as AnyDuringMigration)['path'] + 'media/'; + pathToMedia = (options as any)['path'] + 'media/'; } let oneBasedIndex; - if ((options as AnyDuringMigration)['oneBasedIndex'] === undefined) { - oneBasedIndex = true; - } else { - oneBasedIndex = !!(options as AnyDuringMigration)['oneBasedIndex']; - } - const renderer = (options as AnyDuringMigration)['renderer'] || 'geras'; + const rawOneBasedIndex = options['oneBasedIndex']; + oneBasedIndex = rawOneBasedIndex === undefined ? true : rawOneBasedIndex; + const renderer = options['renderer'] || 'geras'; - const plugins = (options as AnyDuringMigration)['plugins'] || {}; + const plugins = options['plugins'] || {}; this.RTL = rtl; this.oneBasedIndex = oneBasedIndex; @@ -178,8 +163,8 @@ export class Options { this.comments = hasComments; this.disable = hasDisable; this.readOnly = readOnly; - this.maxBlocks = (options as AnyDuringMigration)['maxBlocks'] || Infinity; - this.maxInstances = (options as AnyDuringMigration)['maxInstances']; + this.maxBlocks = options['maxBlocks'] || Infinity; + this.maxInstances = options['maxInstances'] ?? null; this.pathToMedia = pathToMedia; this.hasCategories = hasCategories; this.moveOptions = Options.parseMoveOptions_(options, hasCategories); @@ -196,15 +181,14 @@ export class Options { this.toolboxPosition = toolboxPosition; this.theme = Options.parseThemeOptions_(options); this.renderer = renderer; - this.rendererOverrides = - (options as AnyDuringMigration)['rendererOverrides']; + this.rendererOverrides = options['rendererOverrides'] ?? null; /** * The parent of the current workspace, or null if there is no parent * workspace. We can assert that this is of type WorkspaceSvg as opposed to * Workspace as this is only used in a rendered workspace. */ - this.parentWorkspace = (options as AnyDuringMigration)['parentWorkspace']; + this.parentWorkspace = options['parentWorkspace'] ?? null; /** Map of plugin type to name of registered plugin or plugin class. */ this.plugins = plugins; @@ -218,84 +202,45 @@ export class Options { * @return Normalized move options. */ private static parseMoveOptions_( - options: AnyDuringMigration, hasCategories: boolean): MoveOptions { + options: BlocklyOptions, hasCategories: boolean): MoveOptions { const move = options['move'] || {}; const moveOptions = {} as MoveOptions; if (move['scrollbars'] === undefined && options['scrollbars'] === undefined) { - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. - (moveOptions as AnyDuringMigration).scrollbars = hasCategories; + moveOptions.scrollbars = hasCategories; } else if (typeof move['scrollbars'] === 'object') { - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. - (moveOptions as AnyDuringMigration).scrollbars = {}; - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. - (moveOptions as AnyDuringMigration).scrollbars.horizontal = - !!move['scrollbars']['horizontal']; - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. - (moveOptions as AnyDuringMigration).scrollbars.vertical = - !!move['scrollbars']['vertical']; + moveOptions.scrollbars = { + 'horizontal': !!move['scrollbars']['horizontal'], + 'vertical': !!move['scrollbars']['vertical'], + }; // Convert scrollbars object to boolean if they have the same value. // This allows us to easily check for whether any scrollbars exist using // !!moveOptions.scrollbars. - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. AnyDuringMigration because: Property 'scrollbars' does not - // exist on type '{}'. - if ((moveOptions as AnyDuringMigration).scrollbars.horizontal && - (moveOptions as AnyDuringMigration).scrollbars.vertical) { - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. - (moveOptions as AnyDuringMigration).scrollbars = true; - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. AnyDuringMigration because: Property 'scrollbars' does - // not exist on type '{}'. + if (moveOptions.scrollbars.horizontal && + moveOptions.scrollbars.vertical) { + moveOptions.scrollbars = true; } else if ( - !(moveOptions as AnyDuringMigration).scrollbars.horizontal && - !(moveOptions as AnyDuringMigration).scrollbars.vertical) { - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. - (moveOptions as AnyDuringMigration).scrollbars = false; + !moveOptions.scrollbars.horizontal && + !moveOptions.scrollbars.vertical) { + moveOptions.scrollbars = false; } } else { - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. - (moveOptions as AnyDuringMigration).scrollbars = - !!move['scrollbars'] || !!options['scrollbars']; + moveOptions.scrollbars = !!move['scrollbars'] || !!options['scrollbars']; } - // AnyDuringMigration because: Property 'scrollbars' does not exist on type - // '{}'. - if (!(moveOptions as AnyDuringMigration).scrollbars || - move['wheel'] === undefined) { + if (!moveOptions.scrollbars || move['wheel'] === undefined) { // Defaults to true if single-direction scroll is enabled. - // AnyDuringMigration because: Property 'scrollbars' does not exist on - // type '{}'. AnyDuringMigration because: Property 'wheel' does not exist - // on type '{}'. - (moveOptions as AnyDuringMigration).wheel = - typeof (moveOptions as AnyDuringMigration).scrollbars === 'object'; + moveOptions.wheel = typeof moveOptions.scrollbars === 'object'; } else { - // AnyDuringMigration because: Property 'wheel' does not exist on type - // '{}'. - (moveOptions as AnyDuringMigration).wheel = !!move['wheel']; + moveOptions.wheel = !!move['wheel']; } - // AnyDuringMigration because: Property 'scrollbars' does not exist on type - // '{}'. - if (!(moveOptions as AnyDuringMigration).scrollbars) { - // AnyDuringMigration because: Property 'drag' does not exist on type - // '{}'. - (moveOptions as AnyDuringMigration).drag = false; + if (!moveOptions.scrollbars) { + moveOptions.drag = false; } else if (move['drag'] === undefined) { // Defaults to true if scrollbars is true. - // AnyDuringMigration because: Property 'drag' does not exist on type - // '{}'. - (moveOptions as AnyDuringMigration).drag = true; + moveOptions.drag = true; } else { - // AnyDuringMigration because: Property 'drag' does not exist on type - // '{}'. - (moveOptions as AnyDuringMigration).drag = !!move['drag']; + moveOptions.drag = !!move['drag']; } return moveOptions; } @@ -307,77 +252,43 @@ export class Options { * @param options Dictionary of options. * @return Normalized zoom options. */ - private static parseZoomOptions_(options: AnyDuringMigration): ZoomOptions { + private static parseZoomOptions_(options: BlocklyOptions): ZoomOptions { const zoom = options['zoom'] || {}; const zoomOptions = {} as ZoomOptions; if (zoom['controls'] === undefined) { - // AnyDuringMigration because: Property 'controls' does not exist on type - // '{}'. - (zoomOptions as AnyDuringMigration).controls = false; + zoomOptions.controls = false; } else { - // AnyDuringMigration because: Property 'controls' does not exist on type - // '{}'. - (zoomOptions as AnyDuringMigration).controls = !!zoom['controls']; + zoomOptions.controls = !!zoom['controls']; } if (zoom['wheel'] === undefined) { - // AnyDuringMigration because: Property 'wheel' does not exist on type - // '{}'. - (zoomOptions as AnyDuringMigration).wheel = false; + zoomOptions.wheel = false; } else { - // AnyDuringMigration because: Property 'wheel' does not exist on type - // '{}'. - (zoomOptions as AnyDuringMigration).wheel = !!zoom['wheel']; + zoomOptions.wheel = !!zoom['wheel']; } if (zoom['startScale'] === undefined) { - // AnyDuringMigration because: Property 'startScale' does not exist on - // type '{}'. - (zoomOptions as AnyDuringMigration).startScale = 1; + zoomOptions.startScale = 1; } else { - // AnyDuringMigration because: Property 'startScale' does not exist on - // type '{}'. - (zoomOptions as AnyDuringMigration).startScale = - Number(zoom['startScale']); + zoomOptions.startScale = Number(zoom['startScale']); } if (zoom['maxScale'] === undefined) { - // AnyDuringMigration because: Property 'maxScale' does not exist on type - // '{}'. - (zoomOptions as AnyDuringMigration).maxScale = 3; + zoomOptions.maxScale = 3; } else { - // AnyDuringMigration because: Property 'maxScale' does not exist on type - // '{}'. - (zoomOptions as AnyDuringMigration).maxScale = Number(zoom['maxScale']); + zoomOptions.maxScale = Number(zoom['maxScale']); } if (zoom['minScale'] === undefined) { - // AnyDuringMigration because: Property 'minScale' does not exist on type - // '{}'. - (zoomOptions as AnyDuringMigration).minScale = 0.3; + zoomOptions.minScale = 0.3; } else { - // AnyDuringMigration because: Property 'minScale' does not exist on type - // '{}'. - (zoomOptions as AnyDuringMigration).minScale = Number(zoom['minScale']); + zoomOptions.minScale = Number(zoom['minScale']); } if (zoom['scaleSpeed'] === undefined) { - // AnyDuringMigration because: Property 'scaleSpeed' does not exist on - // type '{}'. - (zoomOptions as AnyDuringMigration).scaleSpeed = 1.2; + zoomOptions.scaleSpeed = 1.2; } else { - // AnyDuringMigration because: Property 'scaleSpeed' does not exist on - // type '{}'. - (zoomOptions as AnyDuringMigration).scaleSpeed = - Number(zoom['scaleSpeed']); + zoomOptions.scaleSpeed = Number(zoom['scaleSpeed']); } if (zoom['pinch'] === undefined) { - // AnyDuringMigration because: Property 'controls' does not exist on type - // '{}'. AnyDuringMigration because: Property 'wheel' does not exist on - // type '{}'. AnyDuringMigration because: Property 'pinch' does not exist - // on type '{}'. - (zoomOptions as AnyDuringMigration).pinch = - (zoomOptions as AnyDuringMigration).wheel || - (zoomOptions as AnyDuringMigration).controls; + zoomOptions.pinch = zoomOptions.wheel || zoomOptions.controls; } else { - // AnyDuringMigration because: Property 'pinch' does not exist on type - // '{}'. - (zoomOptions as AnyDuringMigration).pinch = !!zoom['pinch']; + zoomOptions.pinch = !!zoom['pinch']; } return zoomOptions; } @@ -389,24 +300,14 @@ export class Options { * @param options Dictionary of options. * @return Normalized grid options. */ - private static parseGridOptions_(options: AnyDuringMigration): GridOptions { + private static parseGridOptions_(options: BlocklyOptions): GridOptions { const grid = options['grid'] || {}; const gridOptions = {} as GridOptions; - // AnyDuringMigration because: Property 'spacing' does not exist on type - // '{}'. - (gridOptions as AnyDuringMigration).spacing = Number(grid['spacing']) || 0; - // AnyDuringMigration because: Property 'colour' does not exist on type - // '{}'. - (gridOptions as AnyDuringMigration).colour = grid['colour'] || '#888'; - // AnyDuringMigration because: Property 'length' does not exist on type - // '{}'. - (gridOptions as AnyDuringMigration).length = + gridOptions.spacing = Number(grid['spacing']) || 0; + gridOptions.colour = grid['colour'] || '#888'; + gridOptions.length = grid['length'] === undefined ? 1 : Number(grid['length']); - // AnyDuringMigration because: Property 'spacing' does not exist on type - // '{}'. AnyDuringMigration because: Property 'snap' does not exist on type - // '{}'. - (gridOptions as AnyDuringMigration).snap = - (gridOptions as AnyDuringMigration).spacing > 0 && !!grid['snap']; + gridOptions.snap = gridOptions.spacing > 0 && !!grid['snap']; return gridOptions; } @@ -416,7 +317,7 @@ export class Options { * @param options Dictionary of options. * @return A Blockly Theme. */ - private static parseThemeOptions_(options: AnyDuringMigration): Theme { + private static parseThemeOptions_(options: BlocklyOptions): Theme { const theme = options['theme'] || Classic; if (typeof theme === 'string') { return registry.getObject(registry.Type.THEME, theme) as Theme; diff --git a/core/renderers/common/block_rendering.ts b/core/renderers/common/block_rendering.ts index 20f968d62..6aaad19a5 100644 --- a/core/renderers/common/block_rendering.ts +++ b/core/renderers/common/block_rendering.ts @@ -125,7 +125,8 @@ export function stopDebugger() { * @internal */ export function init( - name: string, theme: Theme, opt_rendererOverrides?: object): Renderer { + name: string, theme: Theme, + opt_rendererOverrides?: {[rendererConstant: string]: any}): Renderer { const rendererClass = registry.getClass(registry.Type.RENDERER, name); const renderer = new rendererClass!(name); renderer.init(theme, opt_rendererOverrides); diff --git a/core/theme.ts b/core/theme.ts index d8355e054..857a1666c 100644 --- a/core/theme.ts +++ b/core/theme.ts @@ -19,11 +19,21 @@ import * as registry from './registry.js'; import * as object from './utils/object.js'; +export interface ITheme { + blockStyles: {[key: string]: BlockStyle}; + categoryStyles: {[key: string]: CategoryStyle}; + componentStyles: ComponentStyle; + fontStyle: FontStyle; + startHats: boolean|null; + base?: string|Theme; + name: string; +} + /** * Class for a theme. * @alias Blockly.Theme */ -export class Theme { +export class Theme implements ITheme { /** @internal */ blockStyles: {[key: string]: BlockStyle}; /** @internal */ @@ -141,13 +151,13 @@ export class Theme { * @param themeObj An object containing theme properties. * @return A new Blockly theme. */ - static defineTheme(name: string, themeObj: AnyDuringMigration): Theme { + static defineTheme(name: string, themeObj: ITheme): Theme { name = name.toLowerCase(); const theme = new Theme(name); let base = themeObj['base']; if (base) { if (typeof base === 'string') { - base = registry.getObject(registry.Type.THEME, base); + base = registry.getObject(registry.Type.THEME, base) ?? undefined; } if (base instanceof Theme) { object.deepMerge(theme, base); diff --git a/core/workspace_svg.ts b/core/workspace_svg.ts index 2ce258bf2..6b567377c 100644 --- a/core/workspace_svg.ts +++ b/core/workspace_svg.ts @@ -464,7 +464,7 @@ export class WorkspaceSvg extends Workspace implements IASTNodeLocationSvg { /** The block renderer used for rendering blocks on this workspace. */ this.renderer_ = blockRendering.init( this.options.renderer || 'geras', this.getTheme(), - this.options.rendererOverrides); + this.options.rendererOverrides ?? undefined); /** * The cached size of the parent svg element.