chore: create test for undo block movements and editing a field (#7272)

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

* chore: create test for undo block movements and editing a field

tests/browser/test/block_undo_test.js

@@ -0,0 +1,63 @@
+/**
+ * @license
+ * Copyright 2023 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview Node.js script to run Automated tests in Chrome, via webdriver.
+ */
+
+const chai = require('chai');
+const {Key} = require('webdriverio');
+const {
+  testSetup,
+  testFileLocations,
+  switchRTL,
+  dragBlockTypeFromFlyout,
+  screenDirection,
+} = require('./test_setup');
+
+let browser;
+suite('Testing undo block movement', 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('Undoing Block Movement LTR', async function () {
+    await testUndoBlock(screenDirection.LTR);
+  });
+
+  test('Undoing Block Movement RTL', async function () {
+    await switchRTL(browser);
+    await testUndoBlock(screenDirection.RTL);
+  });
+
+  // Teardown entire suite after test are done running
+  suiteTeardown(async function () {
+    await browser.deleteSession();
+  });
+});
+
+async function testUndoBlock(delta) {
+  // Drag out first function
+  const defReturnBlock = await dragBlockTypeFromFlyout(
+    browser,
+    'Functions',
+    'procedures_defreturn',
+    50 * delta,
+    20
+  );
+
+  await browser.keys([Key.Ctrl, 'z']);
+
+  const blockOnWorkspace = await browser.execute(() => {
+    return !!Blockly.getMainWorkspace().getAllBlocks(false)[0];
+  });
+
+  chai.assert.isFalse(blockOnWorkspace);
+}

tests/browser/test/field_edits_test.js

@@ -0,0 +1,75 @@
+/**
+ * @license
+ * Copyright 2023 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview Node.js script to run Automated tests in Chrome, via webdriver.
+ */
+
+const chai = require('chai');
+const {
+  testSetup,
+  testFileLocations,
+  getSelectedBlockElement,
+  switchRTL,
+  dragBlockTypeFromFlyout,
+  screenDirection,
+} = require('./test_setup');
+const {Key} = require('webdriverio');
+
+let browser;
+suite('Testing Field Edits', 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('Testing Field Edits LTR', async function () {
+    await testFieldEdits(screenDirection.LTR);
+  });
+
+  test('Testing Field Edits RTL', async function () {
+    switchRTL(browser);
+    await testFieldEdits(screenDirection.RTL);
+  });
+
+  // Teardown entire suite after test are done running
+  suiteTeardown(async function () {
+    await browser.deleteSession();
+  });
+});
+
+async function testFieldEdits(delta) {
+  const mathNumber = await dragBlockTypeFromFlyout(
+    browser,
+    'Math',
+    'math_number',
+    50 * delta,
+    20
+  );
+  await browser.pause(2000);
+
+  // Click on the field to change the value
+  const numeric = await getSelectedBlockElement(browser);
+  await numeric.doubleClick();
+  await browser.keys([Key.Delete]);
+  await numeric.doubleClick();
+  await browser.keys(['1093']);
+  // Click on the workspace
+  const workspace = await browser.$('#blocklyDiv > div > svg.blocklySvg > g');
+  await workspace.click();
+  await browser.pause(2000);
+  // Get value of the number
+  const numericText = await browser
+    .$(
+      '#blocklyDiv > div > svg.blocklySvg > g > g.blocklyBlockCanvas > g.blocklyDraggable > g > text'
+    )
+    .getHTML();
+
+  chai.assert.isTrue(numericText.includes('1093'));
+}

tests/browser/test/test_setup.js

@@ -73,6 +73,16 @@ const testFileLocations = {
   playground: 2,
 };
 
+/**
+ * Enum for both LTR and RTL use cases.
+ * @readonly
+ * @enum {number}
+ */
+const screenDirection = {
+  RTL: -1,
+  LTR: 1,
+};
+
 async function getSelectedBlockId(browser) {
   return await browser.execute(() => {
     // Note: selected is an ICopyable and I am assuming that it is a BlockSvg.
@@ -200,6 +210,11 @@ async function connect(
   await draggedBlock.dragAndDrop(delta);
 }
 
+async function switchRTL(browser) {
+  // Switch to RTL
+  const ltrForm = await browser.$('#options > select:nth-child(1)');
+  await ltrForm.selectByIndex(1);
+}
 async function dragNthBlockFromFlyout(browser, categoryName, n, x, y) {
   const flyoutBlock = await getNthBlockOfCategory(browser, categoryName, n);
   await flyoutBlock.dragAndDrop({x: x, y: y});
@@ -235,5 +250,8 @@ module.exports = {
   getBlockTypeFromCategory,
   dragNthBlockFromFlyout,
   connect,
+  switchRTL,
   contextMenuSelect,
+  dragBlockTypeFromFlyout,
+  screenDirection,
 };