diff --git a/core/events/events_comment_move.ts b/core/events/events_comment_move.ts index fa05de2a8..40f2a0da3 100644 --- a/core/events/events_comment_move.ts +++ b/core/events/events_comment_move.ts @@ -52,7 +52,7 @@ export class CommentMove extends CommentBase { } this.comment_ = opt_comment; - this.oldCoordinate_ = opt_comment.getXY(); + this.oldCoordinate_ = opt_comment.getRelativeToSurfaceXY(); } /** @@ -70,7 +70,7 @@ export class CommentMove extends CommentBase { 'The comment is undefined. Pass a comment to ' + 'the constructor if you want to use the record functionality'); } - this.newCoordinate_ = this.comment_.getXY(); + this.newCoordinate_ = this.comment_.getRelativeToSurfaceXY(); } /** @@ -180,7 +180,7 @@ export class CommentMove extends CommentBase { 'or call fromJson'); } // TODO: Check if the comment is being dragged, and give up if so. - const current = comment.getXY(); + const current = comment.getRelativeToSurfaceXY(); comment.moveBy(target.x - current.x, target.y - current.y); } } diff --git a/core/field_colour.ts b/core/field_colour.ts index db56acf53..73843c0b6 100644 --- a/core/field_colour.ts +++ b/core/field_colour.ts @@ -117,17 +117,13 @@ export class FieldColour extends Field { protected override isDirty_ = false; /** Array of colours used by this field. If null, use the global list. */ - // AnyDuringMigration because: Type 'null' is not assignable to type - // 'string[]'. - private colours_: string[] = null as AnyDuringMigration; + private colours_: string[]|null = null; /** * Array of colour tooltips used by this field. If null, use the global * list. */ - // AnyDuringMigration because: Type 'null' is not assignable to type - // 'string[]'. - private titles_: string[] = null as AnyDuringMigration; + private titles_: string[]|null = null; /** * Number of colour columns used by this field. If 0, use the global @@ -211,8 +207,7 @@ export class FieldColour extends Field { * @param opt_newValue The input value. * @returns A valid colour, or null if invalid. */ - protected override doClassValidation_(opt_newValue?: AnyDuringMigration): - string|null { + protected override doClassValidation_(opt_newValue?: any): string|null { if (typeof opt_newValue !== 'string') { return null; } @@ -415,9 +410,7 @@ export class FieldColour extends Field { /** Handle a mouse enter event. Focus the picker. */ private onMouseEnter_() { - // AnyDuringMigration because: Property 'focus' does not exist on type - // 'Element'. - (this.picker_ as AnyDuringMigration)!.focus({preventScroll: true}); + this.picker_?.focus({preventScroll: true}); } /** @@ -425,9 +418,7 @@ export class FieldColour extends Field { * the currently highlighted colour. */ private onMouseLeave_() { - // AnyDuringMigration because: Property 'blur' does not exist on type - // 'Element'. - (this.picker_ as AnyDuringMigration)!.blur(); + this.picker_?.blur(); const highlighted = this.getHighlighted_(); if (highlighted) { dom.removeClass(highlighted, 'blocklyColourHighlighted'); @@ -473,11 +464,10 @@ export class FieldColour extends Field { this.highlightedIndex_ = index; // Update accessibility roles. - // AnyDuringMigration because: Argument of type 'string | null' is not - // assignable to parameter of type 'string | number | boolean | string[]'. - aria.setState( - this.picker_ as Element, aria.State.ACTIVEDESCENDANT, - cell.getAttribute('id') as AnyDuringMigration); + const cellId = cell.getAttribute('id'); + if (cellId && this.picker_) { + aria.setState(this.picker_, aria.State.ACTIVEDESCENDANT, cellId); + } } /** Create a colour picker dropdown editor. */ diff --git a/core/field_image.ts b/core/field_image.ts index ab0a6bb37..a265a182b 100644 --- a/core/field_image.ts +++ b/core/field_image.ts @@ -35,12 +35,10 @@ export class FieldImage extends Field { private readonly imageHeight_: number; /** The function to be called when this field is clicked. */ - private clickHandler_: ((p1: FieldImage) => AnyDuringMigration)|null = null; + private clickHandler_: ((p1: FieldImage) => void)|null = null; /** The rendered field's image element. */ - // AnyDuringMigration because: Type 'null' is not assignable to type - // 'SVGImageElement'. - private imageElement_: SVGImageElement = null as AnyDuringMigration; + private imageElement_: SVGImageElement|null = null; /** * Editable fields usually show some sort of UI indicating they are @@ -79,7 +77,7 @@ export class FieldImage extends Field { */ constructor( src: string|Sentinel, width: string|number, height: string|number, - opt_alt?: string, opt_onClick?: (p1: FieldImage) => AnyDuringMigration, + opt_alt?: string, opt_onClick?: (p1: FieldImage) => void, opt_flipRtl?: boolean, opt_config?: FieldImageConfig) { super(Field.SKIP_SETUP); @@ -164,8 +162,7 @@ export class FieldImage extends Field { * @param opt_newValue The input value. * @returns A string, or null if invalid. */ - protected override doClassValidation_(opt_newValue?: AnyDuringMigration): - string|null { + protected override doClassValidation_(opt_newValue?: any): string|null { if (typeof opt_newValue !== 'string') { return null; } @@ -226,7 +223,7 @@ export class FieldImage extends Field { * @param func The function that is called when the image is clicked, or null * to remove. */ - setOnClickHandler(func: ((p1: FieldImage) => AnyDuringMigration)|null) { + setOnClickHandler(func: ((p1: FieldImage) => void)|null) { this.clickHandler_ = func; } diff --git a/core/interfaces/i_copyable.ts b/core/interfaces/i_copyable.ts index 9c780a317..4c6a7a62c 100644 --- a/core/interfaces/i_copyable.ts +++ b/core/interfaces/i_copyable.ts @@ -31,7 +31,7 @@ export namespace ICopyable { export interface CopyData { saveInfo: Object|Element; source: WorkspaceSvg; - typeCounts: Object|null; + typeCounts: {[key: string]: number}|null; } } diff --git a/core/interfaces/i_selectable_toolbox_item.ts b/core/interfaces/i_selectable_toolbox_item.ts index e7fe06f86..765a42c6e 100644 --- a/core/interfaces/i_selectable_toolbox_item.ts +++ b/core/interfaces/i_selectable_toolbox_item.ts @@ -61,3 +61,11 @@ export interface ISelectableToolboxItem extends IToolboxItem { */ onClick(_e: Event): void; } + +/** + * Type guard that checks whether an IToolboxItem is an ISelectableToolboxItem. + */ +export function isSelectableToolboxItem(toolboxItem: IToolboxItem): + toolboxItem is ISelectableToolboxItem { + return toolboxItem.isSelectable(); +} diff --git a/core/toolbox/collapsible_category.ts b/core/toolbox/collapsible_category.ts index 1c6ff27fd..c6f45ebdd 100644 --- a/core/toolbox/collapsible_category.ts +++ b/core/toolbox/collapsible_category.ts @@ -42,8 +42,6 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements /** The child toolbox items for this category. */ protected toolboxItems_: IToolboxItem[] = []; - override flyoutItems_: AnyDuringMigration; - override isHidden_: AnyDuringMigration; /** * @param categoryDef The information needed to create a category in the @@ -60,25 +58,18 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements override makeDefaultCssConfig_() { const cssConfig = super.makeDefaultCssConfig_(); - (cssConfig as AnyDuringMigration)['contents'] = 'blocklyToolboxContents'; + cssConfig['contents'] = 'blocklyToolboxContents'; return cssConfig; } override parseContents_(categoryDef: toolbox.CategoryInfo) { - // AnyDuringMigration because: Element implicitly has an 'any' type because - // expression of type '"contents"' can't be used to index type - // 'CategoryInfo'. - const contents = (categoryDef as AnyDuringMigration)['contents']; - let prevIsFlyoutItem = true; - - // AnyDuringMigration because: Element implicitly has an 'any' type because - // expression of type '"custom"' can't be used to index type 'CategoryInfo'. - if ((categoryDef as AnyDuringMigration)['custom']) { - // AnyDuringMigration because: Element implicitly has an 'any' type - // because expression of type '"custom"' can't be used to index type - // 'CategoryInfo'. - this.flyoutItems_ = (categoryDef as AnyDuringMigration)['custom']; - } else if (contents) { + if ('custom' in categoryDef) { + this.flyoutItems_ = categoryDef['custom']; + } else { + const contents = categoryDef['contents']; + if (!contents) return; + this.flyoutItems_ = []; + let prevIsFlyoutItem = true; for (let i = 0; i < contents.length; i++) { const itemDef = contents[i]; // Separators can exist as either a flyout item or a toolbox item so @@ -123,8 +114,8 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements super.init(); this.setExpanded( - (this.toolboxItemDef_ as AnyDuringMigration)['expanded'] === 'true' || - (this.toolboxItemDef_ as AnyDuringMigration)['expanded']); + this.toolboxItemDef_['expanded'] === 'true' || + !!this.toolboxItemDef_['expanded']); } override createDom_() { @@ -141,7 +132,7 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements override createIconDom_() { const toolboxIcon = document.createElement('span'); if (!this.parentToolbox_.isHorizontal()) { - const className = (this.cssConfig_ as AnyDuringMigration)['icon']; + const className = this.cssConfig_['icon']; if (className) { dom.addClass(toolboxIcon, className); } @@ -161,7 +152,7 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements protected createSubCategoriesDom_(subcategories: IToolboxItem[]): HTMLDivElement { const contentsContainer = document.createElement('div'); - const className = (this.cssConfig_ as AnyDuringMigration)['contents']; + const className = this.cssConfig_['contents']; if (className) { dom.addClass(contentsContainer, className); } diff --git a/core/toolbox/toolbox.ts b/core/toolbox/toolbox.ts index 9b700fcf7..8c1aeb577 100644 --- a/core/toolbox/toolbox.ts +++ b/core/toolbox/toolbox.ts @@ -29,6 +29,7 @@ import type {IDraggable} from '../interfaces/i_draggable.js'; import type {IFlyout} from '../interfaces/i_flyout.js'; import type {IKeyboardAccessible} from '../interfaces/i_keyboard_accessible.js'; import type {ISelectableToolboxItem} from '../interfaces/i_selectable_toolbox_item.js'; +import {isSelectableToolboxItem} from '../interfaces/i_selectable_toolbox_item.js'; import type {IStyleable} from '../interfaces/i_styleable.js'; import type {IToolbox} from '../interfaces/i_toolbox.js'; import type {IToolboxItem} from '../interfaces/i_toolbox_item.js'; @@ -100,7 +101,6 @@ export class Toolbox extends DeleteArea implements IAutoHideable, * Ex: [[node, name, func], [node, name, func]]. */ protected boundEvents_: browserEvents.Data[] = []; - override wouldDelete_: AnyDuringMigration; /** The workspace this toolbox is on. */ protected readonly workspace_: WorkspaceSvg; @@ -112,10 +112,9 @@ export class Toolbox extends DeleteArea implements IAutoHideable, this.workspace_ = workspace; /** The JSON describing the contents of this toolbox. */ - // AnyDuringMigration because: Type 'ToolboxInfo | { contents: never[]; }' - // is not assignable to type 'ToolboxInfo'. - this.toolboxDef_ = (workspace.options.languageTree || {'contents': []}) as - AnyDuringMigration; + this.toolboxDef_ = + (workspace.options.languageTree || + {contents: new Array()}); /** Whether the toolbox should be laid out horizontally. */ this.horizontalLayout_ = workspace.options.horizontalLayout; @@ -299,9 +298,8 @@ export class Toolbox extends DeleteArea implements IAutoHideable, if (!handled && this.selectedItem_) { // TODO(#6097): Figure out who implements onKeyDown and which interface it // should be part of. - const untypedItem = this.selectedItem_ as AnyDuringMigration; - if (untypedItem.onKeyDown) { - handled = untypedItem.onKeyDown(e); + if ((this.selectedItem_ as any).onKeyDown) { + handled = (this.selectedItem_ as any).onKeyDown(e); } } @@ -796,33 +794,20 @@ export class Toolbox extends DeleteArea implements IAutoHideable, setSelectedItem(newItem: IToolboxItem|null) { const oldItem = this.selectedItem_; - if (!newItem && !oldItem || newItem && !newItem.isSelectable()) { + if (!newItem && !oldItem || newItem && !isSelectableToolboxItem(newItem)) { return; } - newItem = newItem as ISelectableToolboxItem; - // AnyDuringMigration because: Argument of type 'IToolboxItem' is not - // assignable to parameter of type 'ISelectableToolboxItem'. - if (this.shouldDeselectItem_(oldItem, newItem as AnyDuringMigration) && - oldItem !== null) { + if (this.shouldDeselectItem_(oldItem, newItem) && oldItem !== null) { this.deselectItem_(oldItem); } - // AnyDuringMigration because: Argument of type 'IToolboxItem' is not - // assignable to parameter of type 'ISelectableToolboxItem'. - if (this.shouldSelectItem_(oldItem, newItem as AnyDuringMigration) && - newItem !== null) { - // AnyDuringMigration because: Argument of type 'IToolboxItem' is not - // assignable to parameter of type 'ISelectableToolboxItem'. - this.selectItem_(oldItem, newItem as AnyDuringMigration); + if (this.shouldSelectItem_(oldItem, newItem) && newItem !== null) { + this.selectItem_(oldItem, newItem); } - // AnyDuringMigration because: Argument of type 'IToolboxItem' is not - // assignable to parameter of type 'ISelectableToolboxItem'. - this.updateFlyout_(oldItem, newItem as AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'IToolboxItem' is not - // assignable to parameter of type 'ISelectableToolboxItem'. - this.fireSelectEvent_(oldItem, newItem as AnyDuringMigration); + this.updateFlyout_(oldItem, newItem); + this.fireSelectEvent_(oldItem, newItem); } /** @@ -1044,11 +1029,10 @@ export class Toolbox extends DeleteArea implements IAutoHideable, this.boundEvents_ = []; this.contents_ = []; - // AnyDuringMigration because: Argument of type 'HTMLDivElement | null' is - // not assignable to parameter of type 'Element'. - this.workspace_.getThemeManager().unsubscribe( - this.HtmlDiv as AnyDuringMigration); - dom.removeNode(this.HtmlDiv); + if (this.HtmlDiv) { + this.workspace_.getThemeManager().unsubscribe(this.HtmlDiv); + dom.removeNode(this.HtmlDiv); + } } } diff --git a/core/utils/toolbox.ts b/core/utils/toolbox.ts index 89b2fdbb2..28a64b778 100644 --- a/core/utils/toolbox.ts +++ b/core/utils/toolbox.ts @@ -99,6 +99,7 @@ export interface StaticCategoryInfo { colour: string|undefined; cssconfig: CategoryCssConfig|undefined; hidden: string|undefined; + expanded?: string|boolean; } /** @@ -114,6 +115,7 @@ export interface DynamicCategoryInfo { colour: string|undefined; cssconfig: CategoryCssConfig|undefined; hidden: string|undefined; + expanded?: string|boolean; } /** diff --git a/core/workspace.ts b/core/workspace.ts index 4db632f96..4018cef9f 100644 --- a/core/workspace.ts +++ b/core/workspace.ts @@ -172,22 +172,11 @@ export class Workspace implements IASTNodeLocation { */ private sortObjects_(a: Block|WorkspaceComment, b: Block|WorkspaceComment): number { - // AnyDuringMigration because: Property 'getRelativeToSurfaceXY' does not - // exist on type 'Block | WorkspaceComment'. - const aXY = (a as AnyDuringMigration).getRelativeToSurfaceXY(); - // AnyDuringMigration because: Property 'getRelativeToSurfaceXY' does not - // exist on type 'Block | WorkspaceComment'. - const bXY = (b as AnyDuringMigration).getRelativeToSurfaceXY(); - // AnyDuringMigration because: Property 'offset' does not exist on type - // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'. - // AnyDuringMigration because: Property 'offset' does not exist on type - // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'. - return aXY.y + - (Workspace.prototype.sortObjects_ as AnyDuringMigration).offset * - aXY.x - - (bXY.y + - (Workspace.prototype.sortObjects_ as AnyDuringMigration).offset * - bXY.x); + const offset = + Math.sin(math.toRadians(Workspace.SCAN_ANGLE)) * (this.RTL ? -1 : 1); + const aXY = a.getRelativeToSurfaceXY(); + const bXY = b.getRelativeToSurfaceXY(); + return aXY.y + offset * aXY.x - (bXY.y + offset * bXY.x); } /** @@ -221,17 +210,7 @@ export class Workspace implements IASTNodeLocation { // Copy the topBlocks list. const blocks = (new Array()).concat(this.topBlocks); if (ordered && blocks.length > 1) { - // AnyDuringMigration because: Property 'offset' does not exist on type - // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'. - (this.sortObjects_ as AnyDuringMigration).offset = - Math.sin(math.toRadians(Workspace.SCAN_ANGLE)); - if (this.RTL) { - // AnyDuringMigration because: Property 'offset' does not exist on type - // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => - // number'. - (this.sortObjects_ as AnyDuringMigration).offset *= -1; - } - blocks.sort(this.sortObjects_); + blocks.sort(this.sortObjects_.bind(this)); } return blocks; } @@ -274,20 +253,10 @@ export class Workspace implements IASTNodeLocation { } const blocks = this.typedBlocksDB.get(type)!.slice(0); if (ordered && blocks && blocks.length > 1) { - // AnyDuringMigration because: Property 'offset' does not exist on type - // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'. - (this.sortObjects_ as AnyDuringMigration).offset = - Math.sin(math.toRadians(Workspace.SCAN_ANGLE)); - if (this.RTL) { - // AnyDuringMigration because: Property 'offset' does not exist on type - // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => - // number'. - (this.sortObjects_ as AnyDuringMigration).offset *= -1; - } - blocks.sort(this.sortObjects_); + blocks.sort(this.sortObjects_.bind(this)); } - return blocks.filter(function(block: AnyDuringMigration) { + return blocks.filter(function(block: Block) { return !block.isInsertionMarker(); }); } @@ -340,17 +309,7 @@ export class Workspace implements IASTNodeLocation { // Copy the topComments list. const comments = (new Array()).concat(this.topComments); if (ordered && comments.length > 1) { - // AnyDuringMigration because: Property 'offset' does not exist on type - // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'. - (this.sortObjects_ as AnyDuringMigration).offset = - Math.sin(math.toRadians(Workspace.SCAN_ANGLE)); - if (this.RTL) { - // AnyDuringMigration because: Property 'offset' does not exist on type - // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => - // number'. - (this.sortObjects_ as AnyDuringMigration).offset *= -1; - } - comments.sort(this.sortObjects_); + comments.sort(this.sortObjects_.bind(this)); } return comments; } @@ -363,7 +322,7 @@ export class Workspace implements IASTNodeLocation { * @returns Array of blocks. */ getAllBlocks(ordered: boolean): Block[] { - let blocks: AnyDuringMigration[]; + let blocks: Block[]; if (ordered) { // Slow, but ordered. const topBlocks = this.getTopBlocks(true); @@ -598,7 +557,7 @@ export class Workspace implements IASTNodeLocation { * to be created). * @returns True if there is capacity for the given map, false otherwise. */ - isCapacityAvailable(typeCountsMap: AnyDuringMigration): boolean { + isCapacityAvailable(typeCountsMap: {[key: string]: number}): boolean { if (!this.hasBlockLimits()) { return true; } @@ -661,9 +620,9 @@ export class Workspace implements IASTNodeLocation { // Do another undo/redo if the next one is of the same group. while (inputStack.length && inputEvent.group && inputEvent.group === inputStack[inputStack.length - 1].group) { - // AnyDuringMigration because: Argument of type 'Abstract | undefined' is - // not assignable to parameter of type 'Abstract'. - events.push(inputStack.pop() as AnyDuringMigration); + const event = inputStack.pop(); + if (!event) continue; + events.push(event); } // Push these popped events on the opposite stack. for (let i = 0; i < events.length; i++) { diff --git a/core/workspace_comment.ts b/core/workspace_comment.ts index 6e218c858..8870c6245 100644 --- a/core/workspace_comment.ts +++ b/core/workspace_comment.ts @@ -154,7 +154,7 @@ export class WorkspaceComment { * This is not valid if the comment is currently being dragged. * @internal */ - getXY(): Coordinate { + getRelativeToSurfaceXY(): Coordinate { return new Coordinate(this.xy_.x, this.xy_.y); } diff --git a/core/workspace_comment_svg.ts b/core/workspace_comment_svg.ts index 329d37ceb..4a86e89f9 100644 --- a/core/workspace_comment_svg.ts +++ b/core/workspace_comment_svg.ts @@ -88,7 +88,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements private autoLayout_ = false; // Create core elements for the block. private readonly svgGroup_: SVGElement; - svgRect_: AnyDuringMigration; + svgRect_: SVGRectElement; /** Whether the comment is rendered onscreen and is a part of the DOM. */ private rendered_ = false; @@ -296,20 +296,18 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements * @returns Object with .x and .y properties in workspace coordinates. * @internal */ - getRelativeToSurfaceXY(): Coordinate { + override getRelativeToSurfaceXY(): Coordinate { let x = 0; let y = 0; - let element = this.getSvgRoot(); + let element: Node|null = this.getSvgRoot(); if (element) { do { // Loop through this comment and every parent. const xy = svgMath.getRelativeXY(element as Element); x += xy.x; y += xy.y; - // AnyDuringMigration because: Type 'ParentNode | null' is not - // assignable to type 'SVGElement'. - element = element.parentNode as AnyDuringMigration; + element = element.parentNode; } while (element && element !== this.workspace.getBubbleCanvas() && element !== null); } @@ -533,21 +531,11 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements } const element = this.toXml(opt_noId); const xy = this.getRelativeToSurfaceXY(); - // AnyDuringMigration because: Argument of type 'number' is not assignable - // to parameter of type 'string'. element.setAttribute( - 'x', - Math.round(this.workspace.RTL ? width - xy.x : xy.x) as - AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'number' is not assignable - // to parameter of type 'string'. - element.setAttribute('y', Math.round(xy.y) as AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'number' is not assignable - // to parameter of type 'string'. - element.setAttribute('h', this.getHeight() as AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'number' is not assignable - // to parameter of type 'string'. - element.setAttribute('w', this.getWidth() as AnyDuringMigration); + 'x', String(Math.round(this.workspace.RTL ? width - xy.x : xy.x))); + element.setAttribute('y', String(Math.round(xy.y))); + element.setAttribute('h', String(this.getHeight())); + element.setAttribute('w', String(this.getWidth())); return element; } @@ -588,16 +576,12 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements const size = this.getHeightWidth(); // Add text area - this.createEditor_(); - // AnyDuringMigration because: Argument of type 'SVGForeignObjectElement | - // null' is not assignable to parameter of type 'Node'. - this.svgGroup_.appendChild(this.foreignObject_ as AnyDuringMigration); + const foreignObject = this.createEditor_(); + this.svgGroup_.appendChild(foreignObject); this.svgHandleTarget_ = dom.createSvgElement( Svg.RECT, {'class': 'blocklyCommentHandleTarget', 'x': 0, 'y': 0}); - // AnyDuringMigration because: Argument of type 'SVGRectElement | null' is - // not assignable to parameter of type 'Node'. - this.svgGroup_.appendChild(this.svgHandleTarget_ as AnyDuringMigration); + this.svgGroup_.appendChild(this.svgHandleTarget_); this.svgRectTarget_ = dom.createSvgElement(Svg.RECT, { 'class': 'blocklyCommentTarget', 'x': 0, @@ -605,9 +589,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements 'rx': BORDER_RADIUS, 'ry': BORDER_RADIUS, }); - // AnyDuringMigration because: Argument of type 'SVGRectElement | null' is - // not assignable to parameter of type 'Node'. - this.svgGroup_.appendChild(this.svgRectTarget_ as AnyDuringMigration); + this.svgGroup_.appendChild(this.svgRectTarget_); // Add the resize icon this.addResizeDom_(); @@ -671,10 +653,10 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements textarea.readOnly = !this.isEditable(); body.appendChild(textarea); this.textarea_ = textarea; - this.foreignObject_!.appendChild(body); + this.foreignObject_.appendChild(body); // Don't zoom with mousewheel. browserEvents.conditionalBind( - textarea, 'wheel', this, function(e: AnyDuringMigration) { + textarea, 'wheel', this, function(e: WheelEvent) { e.stopPropagation(); }); browserEvents.conditionalBind( @@ -682,9 +664,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements function(this: WorkspaceCommentSvg, _e: Event) { this.setContent(textarea.value); }); - // AnyDuringMigration because: Type 'SVGForeignObjectElement | null' is not - // assignable to type 'Element'. - return this.foreignObject_ as AnyDuringMigration; + return this.foreignObject_; } /** Add the resize icon to the DOM */ @@ -692,14 +672,10 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements this.resizeGroup_ = dom.createSvgElement( Svg.G, {'class': this.RTL ? 'blocklyResizeSW' : 'blocklyResizeSE'}, this.svgGroup_); - // AnyDuringMigration because: Argument of type 'SVGGElement | null' is not - // assignable to parameter of type 'Element | undefined'. dom.createSvgElement( Svg.POLYGON, {'points': '0,x x,x x,0'.replace(/x/g, RESIZE_SIZE.toString())}, - this.resizeGroup_ as AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'SVGGElement | null' is not - // assignable to parameter of type 'Element | undefined'. + this.resizeGroup_); dom.createSvgElement( Svg.LINE, { 'class': 'blocklyResizeLine', @@ -708,9 +684,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements 'x2': RESIZE_SIZE - 1, 'y2': RESIZE_SIZE / 3, }, - this.resizeGroup_ as AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'SVGGElement | null' is not - // assignable to parameter of type 'Element | undefined'. + this.resizeGroup_); dom.createSvgElement( Svg.LINE, { 'class': 'blocklyResizeLine', @@ -719,22 +693,18 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements 'x2': RESIZE_SIZE - 1, 'y2': RESIZE_SIZE * 2 / 3, }, - this.resizeGroup_ as AnyDuringMigration); + this.resizeGroup_); } /** Add the delete icon to the DOM */ private addDeleteDom_() { this.deleteGroup_ = dom.createSvgElement( Svg.G, {'class': 'blocklyCommentDeleteIcon'}, this.svgGroup_); - // AnyDuringMigration because: Argument of type 'SVGGElement | null' is not - // assignable to parameter of type 'Element | undefined'. this.deleteIconBorder_ = dom.createSvgElement( Svg.CIRCLE, {'class': 'blocklyDeleteIconShape', 'r': '7', 'cx': '7.5', 'cy': '7.5'}, - this.deleteGroup_ as AnyDuringMigration); + this.deleteGroup_); // x icon. - // AnyDuringMigration because: Argument of type 'SVGGElement | null' is not - // assignable to parameter of type 'Element | undefined'. dom.createSvgElement( Svg.LINE, { 'x1': '5', @@ -744,9 +714,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements 'stroke': '#fff', 'stroke-width': '2', }, - this.deleteGroup_ as AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'SVGGElement | null' is not - // assignable to parameter of type 'Element | undefined'. + this.deleteGroup_); dom.createSvgElement( Svg.LINE, { 'x1': '5', @@ -756,7 +724,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements 'stroke': '#fff', 'stroke-width': '2', }, - this.deleteGroup_ as AnyDuringMigration); + this.deleteGroup_); } /** @@ -867,17 +835,15 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements const topOffset = WorkspaceCommentSvg.TOP_OFFSET; const textOffset = TEXTAREA_OFFSET * 2; - // AnyDuringMigration because: Argument of type 'number' is not assignable - // to parameter of type 'string'. - this.foreignObject_!.setAttribute( - 'width', size.width as AnyDuringMigration); - this.foreignObject_!.setAttribute( - 'height', (size.height - topOffset).toString()); + this.foreignObject_?.setAttribute('width', `${size.width}`); + this.foreignObject_?.setAttribute('height', `${size.height - topOffset}`); if (this.RTL) { - this.foreignObject_!.setAttribute('x', (-size.width).toString()); + this.foreignObject_?.setAttribute('x', `${- size.width}`); } - this.textarea_!.style.width = size.width - textOffset + 'px'; - this.textarea_!.style.height = size.height - textOffset - topOffset + 'px'; + + if (!this.textarea_) return; + this.textarea_.style.width = size.width - textOffset + 'px'; + this.textarea_.style.height = size.height - textOffset - topOffset + 'px'; } /** @@ -892,24 +858,16 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements height = Math.max(height, 20 + WorkspaceCommentSvg.TOP_OFFSET); this.width_ = width; this.height_ = height; - this.svgRect_.setAttribute('width', width); - this.svgRect_.setAttribute('height', height); - // AnyDuringMigration because: Argument of type 'number' is not assignable - // to parameter of type 'string'. - this.svgRectTarget_!.setAttribute('width', width as AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'number' is not assignable - // to parameter of type 'string'. - this.svgRectTarget_!.setAttribute('height', height as AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'number' is not assignable - // to parameter of type 'string'. - this.svgHandleTarget_!.setAttribute('width', width as AnyDuringMigration); - // AnyDuringMigration because: Argument of type 'number' is not assignable - // to parameter of type 'string'. - this.svgHandleTarget_!.setAttribute( - 'height', WorkspaceCommentSvg.TOP_OFFSET as AnyDuringMigration); + this.svgRect_.setAttribute('width', `${width}`); + this.svgRect_.setAttribute('height', `${height}`); + this.svgRectTarget_?.setAttribute('width', `${width}`); + this.svgRectTarget_?.setAttribute('height', `${height}`); + this.svgHandleTarget_?.setAttribute('width', `${width}`); + this.svgHandleTarget_?.setAttribute( + 'height', `${WorkspaceCommentSvg.TOP_OFFSET}`); if (this.RTL) { this.svgRect_.setAttribute('transform', 'scale(-1 1)'); - this.svgRectTarget_!.setAttribute('transform', 'scale(-1 1)'); + this.svgRectTarget_?.setAttribute('transform', 'scale(-1 1)'); } if (this.resizeGroup_) { @@ -919,7 +877,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements 'transform', 'translate(' + (-width + RESIZE_SIZE) + ',' + (height - RESIZE_SIZE) + ') scale(-1 1)'); - this.deleteGroup_!.setAttribute( + this.deleteGroup_?.setAttribute( 'transform', 'translate(' + (-width + RESIZE_SIZE) + ',' + -RESIZE_SIZE + ') scale(-1 1)'); @@ -928,7 +886,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements 'transform', 'translate(' + (width - RESIZE_SIZE) + ',' + (height - RESIZE_SIZE) + ')'); - this.deleteGroup_!.setAttribute( + this.deleteGroup_?.setAttribute( 'transform', 'translate(' + (width - RESIZE_SIZE) + ',' + -RESIZE_SIZE + ')'); } diff --git a/tests/mocha/workspace_comment_test.js b/tests/mocha/workspace_comment_test.js index 0ea07b88b..1fe3bfc76 100644 --- a/tests/mocha/workspace_comment_test.js +++ b/tests/mocha/workspace_comment_test.js @@ -152,14 +152,14 @@ suite('Workspace comment', function() { }); test('Initial position', function() { - const xy = this.comment.getXY(); + const xy = this.comment.getRelativeToSurfaceXY(); chai.assert.equal(xy.x, 0, 'Initial X position'); chai.assert.equal(xy.y, 0, 'Initial Y position'); }); test('moveBy', function() { this.comment.moveBy(10, 100); - const xy = this.comment.getXY(); + const xy = this.comment.getRelativeToSurfaceXY(); chai.assert.equal(xy.x, 10, 'New X position'); chai.assert.equal(xy.y, 100, 'New Y position'); });