feat(tests): add right click tests and helpers (#7262)

* feat(tests): add test for collapsing block

* chore: format

* chore: format

* feat(tests): add right-click tests and helpers

* chore(tests): respond to review feedback

tests/browser/test/basic_playground_test.js

@@ -9,7 +9,24 @@
  */
 
 const chai = require('chai');
-const {testSetup, testFileLocations} = require('./test_setup');
+const {
+  testSetup,
+  testFileLocations,
+  dragNthBlockFromFlyout,
+  contextMenuSelect,
+} = require('./test_setup');
+
+async function getIsCollapsed(browser, blockId) {
+  return await browser.execute((blockId) => {
+    return Blockly.getMainWorkspace().getBlockById(blockId).isCollapsed();
+  }, blockId);
+}
+
+async function getIsEnabled(browser, blockId) {
+  return await browser.execute((blockId) => {
+    return Blockly.getMainWorkspace().getBlockById(blockId).isEnabled();
+  }, blockId);
+}
 
 let browser;
 suite('Testing Connecting Blocks', function (done) {
@@ -46,3 +63,74 @@ suite('Testing Connecting Blocks', function (done) {
     await browser.deleteSession();
   });
 });
+
+suite('Right Clicking on Blocks', function (done) {
+  // Setting timeout to unlimited as the webdriver takes a longer time to run than most mocha test
+  this.timeout(0);
+
+  // Setup Selenium for all of the tests
+  suiteSetup(async function () {
+    browser = await testSetup(testFileLocations.playground);
+  });
+
+  test('Collapse', async function () {
+    await browser.refresh();
+    const block = await dragNthBlockFromFlyout(browser, 'Loops', 0, 20, 20);
+
+    const blockId = block.id;
+    let isCollapsed = await getIsCollapsed(browser, blockId);
+    chai.assert.isFalse(isCollapsed);
+
+    await contextMenuSelect(browser, block, 'Collapse Block');
+
+    isCollapsed = await getIsCollapsed(browser, blockId);
+
+    chai.assert.isTrue(isCollapsed);
+  });
+
+  test('Expand', async function () {
+    await browser.refresh();
+    const block = await dragNthBlockFromFlyout(browser, 'Loops', 0, 20, 20);
+
+    await contextMenuSelect(browser, block, 'Collapse Block');
+    await contextMenuSelect(browser, block, 'Expand Block');
+
+    // Verify.
+    const blockId = block.id;
+    const isCollapsed = await getIsCollapsed(browser, blockId);
+    chai.assert.isFalse(isCollapsed);
+  });
+
+  test('Disable', async function () {
+    await browser.refresh();
+    const block = await dragNthBlockFromFlyout(browser, 'Loops', 0, 20, 20);
+
+    const blockId = block.id;
+    let isEnabled = await getIsEnabled(browser, blockId);
+    chai.assert.isTrue(isEnabled);
+
+    await contextMenuSelect(browser, block, 'Disable Block');
+
+    await new Promise((resolve) => setTimeout(resolve, 2000)); // 2 sec
+
+    isEnabled = await getIsEnabled(browser, blockId);
+    chai.assert.isFalse(isEnabled);
+  });
+
+  test('Enable', async function () {
+    await browser.refresh();
+    const block = await dragNthBlockFromFlyout(browser, 'Loops', 0, 20, 20);
+
+    const blockId = block.id;
+    await contextMenuSelect(browser, block, 'Disable Block');
+    await contextMenuSelect(browser, block, 'Enable Block');
+
+    const isEnabled = await getIsEnabled(browser, blockId);
+    chai.assert.isTrue(isEnabled);
+  });
+
+  // Teardown entire suite after test are done running
+  suiteTeardown(async function () {
+    await browser.deleteSession();
+  });
+});

tests/browser/test/procedure_test.js

@@ -82,7 +82,7 @@ suite('Testing Connecting Blocks', function (done) {
       'Text',
       'text_print'
     );
-    await printFlyout.dragAndDrop({x: 50, y: 20});
+    await printFlyout.dragAndDrop({x: 50, y: 0});
     await new Promise((resolve) => setTimeout(resolve, 2000)); // 2 sec
     const print = await getSelectedBlockElement(browser);
 

tests/browser/test/test_setup.js

@@ -200,6 +200,34 @@ async function connect(
   await draggedBlock.dragAndDrop(delta);
 }
 
+async function dragNthBlockFromFlyout(browser, categoryName, n, x, y) {
+  const flyoutBlock = await getNthBlockOfCategory(browser, categoryName, n);
+  await browser.pause(2000);
+  await flyoutBlock.dragAndDrop({x: x, y: y});
+  await browser.pause(2000);
+  return await getSelectedBlockElement(browser);
+}
+
+async function dragBlockTypeFromFlyout(browser, categoryName, type, x, y) {
+  const flyoutBlock = await getBlockTypeFromCategory(
+    browser,
+    categoryName,
+    type
+  );
+  await browser.pause(2000);
+  await flyoutBlock.dragAndDrop({x: x, y: y});
+  await browser.pause(2000);
+  return await getSelectedBlockElement(browser);
+}
+
+async function contextMenuSelect(browser, block, itemText) {
+  await block.click({button: 2});
+  await browser.pause(2000);
+  const item = await browser.$(`div=${itemText}`);
+  await item.click();
+  await browser.pause(2000);
+}
+
 module.exports = {
   testSetup,
   testFileLocations,
@@ -209,5 +237,7 @@ module.exports = {
   getCategory,
   getNthBlockOfCategory,
   getBlockTypeFromCategory,
+  dragNthBlockFromFlyout,
   connect,
+  contextMenuSelect,
 };