test: LEAP-1141: Add test for concurrent saving annotation and draft

web/libs/editor/tests/integration/e2e/drafts/submit.cy.ts

@@ -0,0 +1,69 @@
+import { Choices, LabelStudio, ToolBar } from "@humansignal/frontend-test/helpers/LSF";
+import { FF_CUSTOM_SCRIPT, FF_DEV_3873, FF_REVIEWER_FLOW } from "../../../../src/utils/feature-flags";
+
+enum RESPONSE_TYPE {
+  DRAFT = "draft",
+  SUBMIT = "submit",
+}
+const RESPONSE_DELAY = 100;
+const WAITING_FOR_EVENTS_DELAY = 200;
+
+describe("Annotation submitting process", () => {
+  it("should not create a duplicate annotation if the annotation and draft are saved concurrently", () => {
+    LabelStudio.addFeatureFlagsOnPageLoad({
+      [FF_DEV_3873]: true,
+      [FF_REVIEWER_FLOW]: true,
+      [FF_CUSTOM_SCRIPT]: true,
+    });
+    // here will be stored an order of completed saving action
+    // it consists of strings: "draft" and "submit"
+    const callApi = cy.spy().as("callApi");
+
+    LabelStudio.params()
+      .data({
+        text: "Some words",
+      })
+      .config(`<View>
+  <Text name="text" value="$text" />
+  <Choices toName="text" name="choice">
+    <Choice value="ClickMe"/>
+  </Choices>
+</View>`)
+      // To have "new" annotation we need to use userGenerate
+      .withAnnotation({ userGenerate: true, result: [] })
+      .withEventListener("submitAnnotation", () => {
+        callApi(RESPONSE_TYPE.SUBMIT);
+      })
+      .withEventListener("submitDraft", () => {
+        return new Promise<void>((resolve) => {
+          // initialize saving annotation exactly when request of saving draft should be sent to the server
+          ToolBar.submitBtn.click();
+
+          // this emulates server response delay
+          setTimeout(() => {
+            callApi(RESPONSE_TYPE.DRAFT);
+            resolve();
+          }, RESPONSE_DELAY);
+        });
+      })
+      .init();
+
+    // just to have something to save
+    Choices.findChoice("ClickMe").click();
+
+    // Preventing waiting for autosave. It will save time.
+    cy.window().then(async (win) => {
+      win.Htx.annotationStore.selected.saveDraftImmediately();
+    });
+
+    // Wait for all submit events to be invoked, to have `callOrder` ready to check
+    cy.wait(WAITING_FOR_EVENTS_DELAY);
+
+    // Check order
+    cy.window().then((win) => {
+      expect(callApi).to.be.calledTwice;
+      expect(callApi.firstCall).to.be.calledWith(RESPONSE_TYPE.DRAFT);
+      expect(callApi.secondCall).to.be.calledWith(RESPONSE_TYPE.SUBMIT);
+    });
+  });
+});

web/libs/frontend-test/src/helpers/LSF/ToolBar.ts

@@ -1,6 +1,16 @@
+import { FF_DEV_1170 } from "@humansignal/frontend-test/feature-flags";
+import { LabelStudio } from "@humansignal/frontend-test/helpers/LSF/LabelStudio";
+import { FF_DEV_3873 } from "../../../../editor/src/utils/feature-flags";
+
 export const ToolBar = {
   get root() {
-    return cy.get(".lsf-topbar");
+    return LabelStudio.getFeatureFlag(FF_DEV_3873).then((isFFDEV3873) => {
+      if (isFFDEV3873) {
+        return cy.get(".lsf-bottombar");
+      }
+
+      return cy.get(".lsf-topbar");
+    });
   },
 
   get submitBtn() {