chore(tests): set browser pause time in one place and enable toolbox tests (#7402)

* chore(tests): add a PAUSE_TIME constant for all test pauses

* chore(tests): respond to PR feedback

tests/browser/test/basic_playground_test.js

@@ -16,6 +16,7 @@ const {
   dragBlockTypeFromFlyout,
   connect,
   contextMenuSelect,
+  PAUSE_TIME,
 } = require('./test_setup');
 
 async function getIsCollapsed(browser, blockId) {
@@ -115,12 +116,12 @@ suite('Disabling', function () {
   setup(async function () {
     await this.browser.refresh();
     // Pause to allow refresh time to work.
-    await this.browser.pause(200);
+    await this.browser.pause(PAUSE_TIME + 150);
   });
 
   test(
     'children connected to value inputs are disabled when the ' +
-      'parent is diabled',
+      'parent is disabled',
     async function () {
       const parent = await dragBlockTypeFromFlyout(
         this.browser,

tests/browser/test/delete_blocks_test.js

@@ -11,6 +11,7 @@ const {
   getAllBlocks,
   getBlockElementById,
   contextMenuSelect,
+  PAUSE_TIME,
 } = require('./test_setup');
 const {Key} = require('webdriverio');
 
@@ -98,7 +99,6 @@ const startBlocks = {
     ],
   },
 };
-const pauseLength = 200;
 
 suite('Delete blocks', function (done) {
   // Setting timeout to unlimited as the webdriver takes a longer time to run than most mocha test
@@ -185,7 +185,7 @@ suite('Delete blocks', function (done) {
     );
     await block.click();
     await this.browser.keys([Key.Backspace]);
-    await this.browser.pause(pauseLength);
+    await this.browser.pause(PAUSE_TIME);
     // Undo
     await this.browser.keys([Key.Ctrl, 'Z']);
     const after = (await getAllBlocks(this.browser)).length;
@@ -204,13 +204,13 @@ suite('Delete blocks', function (done) {
     );
     await block.click();
     await this.browser.keys([Key.Backspace]);
-    await this.browser.pause(pauseLength);
+    await this.browser.pause(PAUSE_TIME);
     // Undo
     await this.browser.keys([Key.Ctrl, 'Z']);
-    await this.browser.pause(pauseLength);
+    await this.browser.pause(PAUSE_TIME);
     // Redo
     await this.browser.keys([Key.Ctrl, Key.Shift, 'Z']);
-    await this.browser.pause(pauseLength);
+    await this.browser.pause(PAUSE_TIME);
     const after = (await getAllBlocks(this.browser)).length;
     chai.assert.equal(
       before - 2,

tests/browser/test/extensive_test.js

@@ -14,6 +14,7 @@ const {
   testFileLocations,
   getBlockElementById,
   getAllBlocks,
+  PAUSE_TIME,
 } = require('./test_setup');
 const {Key} = require('webdriverio');
 
@@ -38,14 +39,14 @@ suite('This tests loading Large Configuration and Deletion', function (done) {
     );
     await fourthRepeatDo.click({x: -100, y: -40});
     await this.browser.keys([Key.Delete]);
-    await this.browser.pause(100);
+    await this.browser.pause(PAUSE_TIME);
     const allBlocks = await getAllBlocks(this.browser);
     chai.assert.equal(allBlocks.length, 10);
   });
 
   test('undoing delete block results in the correct number of blocks', async function () {
     await this.browser.keys([Key.Ctrl, 'z']);
-    await this.browser.pause(100);
+    await this.browser.pause(PAUSE_TIME);
     const allBlocks = await getAllBlocks(this.browser);
     chai.assert.equal(allBlocks.length, 13);
   });

tests/browser/test/field_edits_test.js

@@ -14,6 +14,7 @@ const {
   testFileLocations,
   dragBlockTypeFromFlyout,
   screenDirection,
+  PAUSE_TIME,
 } = require('./test_setup');
 const {Key} = require('webdriverio');
 
@@ -49,7 +50,7 @@ async function testFieldEdits(browser, direction) {
   // Click on the workspace to exit the field editor
   const workspace = await browser.$('#blocklyDiv > div > svg.blocklySvg > g');
   await workspace.click();
-  await browser.pause(200);
+  await browser.pause(PAUSE_TIME);
 
   const fieldValue = await browser.execute((id) => {
     return Blockly.getMainWorkspace()

tests/browser/test/mutator_test.js

@@ -17,6 +17,7 @@ const {
   dragBlockTypeFromFlyout,
   getSelectedBlockId,
   screenDirection,
+  PAUSE_TIME,
 } = require('./test_setup');
 
 suite('This tests mutating a Blockly block', function (done) {
@@ -42,19 +43,19 @@ async function testingMutator(browser, delta) {
     delta * 50,
     50,
   );
-  // Click on the mutator and drag out else ig block
+  // Click on the mutator and drag out else if block
   const mutatorWheel = await browser.$(
     '#blocklyDiv > div > svg.blocklySvg > g > g.blocklyBlockCanvas > g.blocklyDraggable.blocklySelected > g.blocklyIconGroup',
   );
   await mutatorWheel.click();
-  await browser.pause(100);
+  await browser.pause(PAUSE_TIME);
   const elseIfFlyout = await browser.$(
     '#blocklyDiv > div > svg.blocklySvg > g > g.blocklyBubbleCanvas > g > g:nth-child(2) > svg:nth-child(1) > g > g.blocklyFlyout > g > g.blocklyBlockCanvas > g:nth-child(3)',
   );
   await elseIfFlyout.dragAndDrop({x: delta * 50, y: 42});
-  await browser.pause(100);
+  await browser.pause(PAUSE_TIME);
 
-  await browser.pause(100);
+  await browser.pause(PAUSE_TIME);
   // Get the ids for the blocks in the mutator
   const blockIds = await browser.execute(() => {
     const mutatorBlock = Blockly.getMainWorkspace().getAllBlocks()[0];
@@ -83,7 +84,7 @@ async function testingMutator(browser, delta) {
     blockIds[0],
     dragBlockSelector,
   );
-  await browser.pause(200);
+  await browser.pause(PAUSE_TIME);
 
   // Get the ids for block after mutating
   const afterInputs = await browser.execute(() => {

tests/browser/test/procedure_test.js

@@ -16,6 +16,7 @@ const {
   getNthBlockOfCategory,
   getBlockTypeFromCategory,
   connect,
+  PAUSE_TIME,
 } = require('./test_setup');
 
 suite('Testing Connecting Blocks', function (done) {
@@ -100,7 +101,7 @@ suite('Testing Connecting Blocks', function (done) {
     // Click run button and verify the number is 123
     const runButton = await this.browser.$('#runButton');
     runButton.click();
-    await this.browser.pause(200);
+    await this.browser.pause(PAUSE_TIME);
     const alertText = await this.browser.getAlertText(); // get the alert text
     chai.assert.equal(alertText, '123');
   });

tests/browser/test/test_setup.js

@@ -22,6 +22,12 @@ const {posixPath} = require('../../../scripts/helpers');
 
 let driver = null;
 
+/**
+ * The default amount of time to wait during a test. Increase this to make
+ * tests easier to watch; decrease it to make tests run faster.
+ */
+const PAUSE_TIME = 50;
+
 /**
  * Start up the test page. This should only be done once, to avoid
  * constantly popping browser windows open and closed.
@@ -351,7 +357,7 @@ async function connect(
 async function switchRTL(browser) {
   const ltrForm = await browser.$('#options > select:nth-child(1)');
   await ltrForm.selectByIndex(1);
-  await browser.pause(500);
+  await browser.pause(PAUSE_TIME + 450);
 }
 
 /**
@@ -426,7 +432,7 @@ async function contextMenuSelect(browser, block, itemText) {
   await item.waitForExist();
   await item.click();
 
-  await browser.pause(100);
+  await browser.pause(PAUSE_TIME);
 }
 
 /**
@@ -463,12 +469,12 @@ async function scrollFlyout(browser, xDelta, yDelta) {
   // and one for the toolbox. We want the second one.
   // This assumes there is only one scrollbar handle in the flyout, but it could
   // be either horizontal or vertical.
-  await browser.pause(50);
+  await browser.pause(PAUSE_TIME);
   const scrollbarHandle = await browser
     .$$(`.blocklyFlyoutScrollbar`)[1]
     .$(`rect.blocklyScrollbarHandle`);
   await scrollbarHandle.dragAndDrop({x: xDelta, y: yDelta});
-  await browser.pause(50);
+  await browser.pause(PAUSE_TIME);
 }
 
 module.exports = {
@@ -491,4 +497,5 @@ module.exports = {
   getBlockTypeFromWorkspace,
   getAllBlocks,
   scrollFlyout,
+  PAUSE_TIME,
 };

tests/browser/test/toolbox_drag_test.js

@@ -15,10 +15,9 @@ const {
   getCategory,
   scrollFlyout,
   screenDirection,
+  PAUSE_TIME,
 } = require('./test_setup');
 
-const PAUSE_TIME = 50;
-
 // Categories in the basic toolbox.
 const basicCategories = [
   'Logic',
@@ -144,32 +143,32 @@ async function openCategories(browser, categoryList, directionMultiplier) {
           // Unicode escape to close flyout.
           await browser.keys(['\uE00C']);
           await browser.pause(PAUSE_TIME);
-        } else {
-          const flyoutBlock = await browser.$(
-            `.blocklyFlyout .blocklyBlockCanvas > g:nth-child(${3 + i * 2})`,
-          );
-          if (!(await elementInBounds(browser, flyoutBlock))) {
-            await scrollFlyout(browser, 0, 500);
-          }
-
-          await flyoutBlock.dragAndDrop({x: directionMultiplier * 50, y: 0});
-          await browser.pause(PAUSE_TIME);
-          // Should be one top level block on the workspace.
-          const topBlockCount = await browser.execute(() => {
-            return Blockly.getMainWorkspace().getTopBlocks(false).length;
-          });
-
-          if (topBlockCount != 1) {
-            failureCount++;
-            console.log(`fail: block ${i} in category ${categoryName}`);
-          }
-
-          // Clean up between blocks so they can't interact with each other.
-          await browser.execute(() => {
-            Blockly.getMainWorkspace().clear();
-          });
-          await browser.pause(PAUSE_TIME);
+          continue;
         }
+        const flyoutBlock = await browser.$(
+          `.blocklyFlyout .blocklyBlockCanvas > g:nth-child(${3 + i * 2})`,
+        );
+        if (!(await elementInBounds(browser, flyoutBlock))) {
+          await scrollFlyout(browser, 0, 500);
+        }
+
+        await flyoutBlock.dragAndDrop({x: directionMultiplier * 50, y: 0});
+        await browser.pause(PAUSE_TIME);
+        // Should be one top level block on the workspace.
+        const topBlockCount = await browser.execute(() => {
+          return Blockly.getMainWorkspace().getTopBlocks(false).length;
+        });
+
+        if (topBlockCount != 1) {
+          failureCount++;
+          console.log(`fail: block ${i} in category ${categoryName}`);
+        }
+
+        // Clean up between blocks so they can't interact with each other.
+        await browser.execute(() => {
+          Blockly.getMainWorkspace().clear();
+        });
+        await browser.pause(PAUSE_TIME);
       }
     } catch (e) {
       failureCount++;
@@ -179,7 +178,7 @@ async function openCategories(browser, categoryList, directionMultiplier) {
   chai.assert.equal(failureCount, 0);
 }
 
-suite.skip('Open toolbox categories', function () {
+suite('Open toolbox categories', function () {
   this.timeout(0);
 
   test('opening every toolbox category in the category toolbox in LTR', async function () {