update e2e tests

Author: paula-stacho

packages/compass-e2e-tests/helpers/selectors.ts

@@ -1151,7 +1151,7 @@ export const UpdateValidationButton =
   '[data-testid="update-validation-button"]';
 export const ValidationMatchingDocumentsPreview =
   '[data-testid="validation-content"] [data-testid="matching-documents"] [data-testid="document-preview"]';
-export const ValidationLoadMatchingDocumentsBtn = `${ValidationMatchingDocumentsPreview} [data-testid="load-sample-document"]`;
+export const ValidationLoadSampleDocumentsBtn = `[data-testid="load-sample-documents"]`;
 export const ValidationNotMatchingDocumentsPreview =
   '[data-testid="validation-content"] [data-testid="notmatching-documents"] [data-testid="document-preview"]';
 export const ValidationLoadNotMatchingDocumentsBtn = `${ValidationNotMatchingDocumentsPreview} [data-testid="load-sample-document"]`;

packages/compass-e2e-tests/tests/collection-validation-tab.test.ts

@@ -10,7 +10,6 @@ import * as Selectors from '../helpers/selectors';
 import { createNumbersCollection } from '../helpers/insert-data';
 
 const NO_PREVIEW_DOCUMENTS = 'No Preview Documents';
-const LOAD_SAMPLE_DOCUMENT = 'Load document';
 const PASSING_VALIDATOR = '{ $jsonSchema: {} }';
 const FAILING_VALIDATOR =
   '{ $jsonSchema: { bsonType: "object", required: [ "phone" ] } }';
@@ -54,9 +53,11 @@ describe('Collection validation tab', function () {
   }
 
   context('when the schema validation is set or modified', function () {
-    it('provides users with a button to load sample documents', async function () {
+    it('provides users with a single button to load sample documents', async function () {
       await addValidation(PASSING_VALIDATOR);
 
+      await browser.clickVisible(Selectors.ValidationLoadSampleDocumentsBtn);
+
       await browser.waitUntil(async () => {
         const matchTextElement = browser.$(
           Selectors.ValidationMatchingDocumentsPreview
@@ -67,18 +68,15 @@ describe('Collection validation tab', function () {
         );
         const notMatchingText = await notMatchingTextElement.getText();
         return (
-          matchText === LOAD_SAMPLE_DOCUMENT &&
-          notMatchingText === LOAD_SAMPLE_DOCUMENT
+          matchText.includes('ObjectId(') &&
+          notMatchingText === NO_PREVIEW_DOCUMENTS
         );
       });
     });
 
     it('supports rules in JSON schema', async function () {
       await addValidation(FAILING_VALIDATOR);
-      await browser.clickVisible(Selectors.ValidationLoadMatchingDocumentsBtn);
-      await browser.clickVisible(
-        Selectors.ValidationLoadNotMatchingDocumentsBtn
-      );
+      await browser.clickVisible(Selectors.ValidationLoadSampleDocumentsBtn);
 
       // nothing passed, everything failed
       await browser.waitUntil(async () => {
@@ -100,10 +98,7 @@ describe('Collection validation tab', function () {
 
       // the automatic indentation and brackets makes multi-line values very fiddly here
       await browser.setValidation(PASSING_VALIDATOR);
-      await browser.clickVisible(Selectors.ValidationLoadMatchingDocumentsBtn);
-      await browser.clickVisible(
-        Selectors.ValidationLoadNotMatchingDocumentsBtn
-      );
+      await browser.clickVisible(Selectors.ValidationLoadSampleDocumentsBtn);
 
       // nothing failed, everything passed
       await browser.waitUntil(async () => {

packages/compass-schema-validation/src/components/sample-documents.tsx

@@ -159,7 +159,11 @@ const InitialState: React.FC<{
         This section displays one document that passed validation and one that
         failed validation.
       </div>
-      <Button onClick={onPreviewClick} variant={ButtonVariant.PrimaryOutline}>
+      <Button
+        onClick={onPreviewClick}
+        variant={ButtonVariant.PrimaryOutline}
+        data-testid="load-sample-documents"
+      >
         Preview documents
       </Button>
     </div>