fix: collapsing blocks with children with icons (#7111)

* fix: collapsing blocks with icons

* chore: add tests for hiding icons of collapsed children
This commit is contained in:
Beka Westberg
2023-05-22 13:53:34 -07:00
committed by GitHub
parent d90d00570f
commit 6e3d052100
6 changed files with 138 additions and 133 deletions

View File

@@ -19,6 +19,7 @@ import {
createChangeListenerSpy,
createMockEvent,
} from './test_helpers/events.js';
import {MockIcon, MockBubbleIcon} from './test_helpers/icon_mocks.js';
suite('Blocks', function () {
setup(function () {
@@ -1418,38 +1419,6 @@ suite('Blocks', function () {
});
suite('Icon management', function () {
class MockIcon {
getType() {
return 'mock icon';
}
initView() {}
dispose() {}
getWeight() {}
getSize() {
return new Blockly.utils.Size(0, 0);
}
applyColour() {}
hideForInsertionMarker() {}
updateEditable() {}
updateCollapsed() {}
isShownWhenCollapsed() {}
setOffsetInBlock() {}
onLocationChange() {}
onClick() {}
}
class MockIconA extends MockIcon {
getType() {
return 'A';
@@ -1624,54 +1593,58 @@ suite('Blocks', function () {
workspaceTeardown.call(this, this.workspace);
});
test('Has Icon', function () {
const block = Blockly.Xml.domToBlock(
Blockly.utils.xml.textToDom('<block type="statement_block"/>'),
test("Collapsing the block closes its contained children's bubbles", function () {
const parentBlock = Blockly.serialization.blocks.append(
{
'type': 'statement_block',
'inputs': {
'STATEMENT': {
'block': {
'type': 'statement_block',
},
},
},
},
this.workspace
);
block.setCommentText('test text');
block.comment.setVisible(true);
chai.assert.isTrue(block.comment.isVisible());
block.setCollapsed(true);
chai.assert.isFalse(block.comment.isVisible());
const childBlock = parentBlock.getInputTargetBlock('STATEMENT');
const icon = new MockBubbleIcon();
childBlock.addIcon(icon);
icon.setBubbleVisible(true);
parentBlock.setCollapsed(true);
chai.assert.isFalse(
icon.bubbleIsVisible(),
"Expected collapsing the parent block to hide the child block's " +
"icon's bubble"
);
});
test('Child Has Icon', function () {
const block = Blockly.Xml.domToBlock(
Blockly.utils.xml.textToDom(
'<block type="statement_block">' +
' <statement name="STATEMENT">' +
' <block type="statement_block"/>' +
' </statement>' +
'</block>'
),
test("Collapsing a block does not close its following childrens' bubbles", function () {
const parentBlock = Blockly.serialization.blocks.append(
{
'type': 'statement_block',
'next': {
'block': {
'type': 'statement_block',
},
},
},
this.workspace
);
const childBlock = block.getInputTargetBlock('STATEMENT');
childBlock.setCommentText('test text');
childBlock.comment.setVisible(true);
chai.assert.isTrue(childBlock.comment.isVisible());
block.setCollapsed(true);
chai.assert.isFalse(childBlock.comment.isVisible());
});
const nextBlock = parentBlock.getNextBlock();
const icon = new MockBubbleIcon();
nextBlock.addIcon(icon);
icon.setBubbleVisible(true);
test('Next Block Has Icon', function () {
const block = Blockly.Xml.domToBlock(
Blockly.utils.xml.textToDom(
'<block type="statement_block">' +
' <next>' +
' <block type="statement_block"/>' +
' </next>' +
'</block>'
),
this.workspace
parentBlock.setCollapsed(true);
chai.assert.isTrue(
icon.bubbleIsVisible(),
'Expected collapsing the parent block to not hide the next ' +
"block's bubble"
);
const nextBlock = block.getNextBlock();
nextBlock.setCommentText('test text');
nextBlock.comment.setVisible(true);
chai.assert.isTrue(nextBlock.comment.isVisible());
block.setCollapsed(true);
chai.assert.isTrue(nextBlock.comment.isVisible());
});
});
});

View File

@@ -11,6 +11,7 @@ import {
sharedTestTeardown,
} from './test_helpers/setup_teardown.js';
import {defineEmptyBlock} from './test_helpers/block_definitions.js';
import {MockIcon, MockSerializableIcon} from './test_helpers/icon_mocks.js';
suite('Icon', function () {
setup(function () {
@@ -22,61 +23,6 @@ suite('Icon', function () {
sharedTestTeardown.call(this);
});
class MockIcon {
getType() {
return 'mock icon';
}
initView() {}
dispose() {}
getWeight() {}
getSize() {
return new Blockly.utils.Size(0, 0);
}
applyColour() {}
hideForInsertionMarker() {}
updateEditable() {}
updateCollapsed() {}
isShownWhenCollapsed() {}
setOffsetInBlock() {}
onLocationChange() {}
onClick() {}
}
class MockSerializableIcon extends MockIcon {
constructor() {
super();
this.state = '';
}
getType() {
return 'serializable icon';
}
getWeight() {
return 1;
}
saveState() {
return 'some state';
}
loadState(state) {
this.state = state;
}
}
class MockNonSerializableIcon extends MockIcon {
getType() {
return 'non-serializable icon';

View File

@@ -0,0 +1,81 @@
/**
* @license
* Copyright 2023 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
export class MockIcon {
getType() {
return 'mock icon';
}
initView() {}
dispose() {}
getWeight() {}
getSize() {
return new Blockly.utils.Size(0, 0);
}
applyColour() {}
hideForInsertionMarker() {}
updateEditable() {}
updateCollapsed() {}
isShownWhenCollapsed() {}
setOffsetInBlock() {}
onLocationChange() {}
onClick() {}
}
export class MockSerializableIcon extends MockIcon {
constructor() {
super();
this.state = '';
}
getType() {
return 'serializable icon';
}
getWeight() {
return 1;
}
saveState() {
return 'some state';
}
loadState(state) {
this.state = state;
}
}
export class MockBubbleIcon extends MockIcon {
constructor() {
super();
this.visible = false;
}
getType() {
return 'bubble icon';
}
updateCollapsed() {}
bubbleIsVisible() {
return this.visible;
}
setBubbleVisible(visible) {
this.visible = visible;
}
}