Added normalization function to make options case-insensitive

packages/core/src/snapshot.js

@@ -165,13 +165,41 @@ function getSnapshotOptions(options, { config, meta }) {
     }
   });
 }
+const optionMappings = {
+    'name': 'name',
+    'widths': 'widths',
+    'scope': 'scope',
+    'scopeoptions': 'scopeOptions',
+    'minheight': 'minHeight',
+    'enablejavascript': 'enableJavaScript',
+    'enablelayout': 'enableLayout',
+    'clientinfo': 'clientInfo',
+    'environmentinfo': 'environmentInfo',
+    'sync': 'sync',
+    'testcase': 'testCase',
+    'labels': 'labels',
+    'thtestcaseexecutionid': 'thTestCaseExecutionId',
+    'resources': 'resources',
+    'meta': 'meta',
+    'snapshot': 'snapshot',
+};
+
+function normalizeOptions(options) {
+  const normalizedOptions = {};
+
+  for (const key in options) {
+    const lowerCaseKey = key.toLowerCase().replace(/[-_]/g, '');
+    const normalizedKey = optionMappings[lowerCaseKey] ? optionMappings[lowerCaseKey] : key;
+    normalizedOptions[normalizedKey] = options[key];
+  }
 
+  return normalizedOptions;
+}
 // Validates and migrates snapshot options against the correct schema based on provided
 // properties. Eagerly throws an error when missing a URL for any snapshot, and warns about all
 // other invalid options which are also scrubbed from the returned migrated options.
 export function validateSnapshotOptions(options) {
   let log = logger('core:snapshot');
-
   // decide which schema to validate against
   let schema = (
     (['domSnapshot', 'dom-snapshot', 'dom_snapshot']
@@ -182,6 +210,8 @@ export function validateSnapshotOptions(options) {
     ('snapshots' in options && '/snapshot/list') ||
     ('/snapshot'));
 
+  options = normalizeOptions(options);
+
   let {
     // normalize, migrate, and remove certain properties from validating
     clientInfo, environmentInfo, snapshots, ...migrated
@@ -213,10 +243,8 @@ export function validateSnapshotOptions(options) {
     log.warn('Encountered snapshot serialization warnings:');
     for (let w of domWarnings) log.warn(`- ${w}`);
   }
-
   // warn on validation errors
   let errors = PercyConfig.validate(migrated, schema);
-
   if (errors?.length > 0) {
     log.warn('Invalid snapshot options:');
     for (let e of errors) log.warn(`- ${e.path}: ${e.message}`);

packages/core/test/percy.test.js

@@ -3,6 +3,7 @@ import { generatePromise, AbortController, base64encode } from '../src/utils.js'
 import Percy from '@percy/core';
 import Pako from 'pako';
 import DetectProxy from '@percy/client/detect-proxy';
+import { validateSnapshotOptions } from '../src/snapshot.js';
 
 describe('Percy', () => {
   let percy, server;
@@ -1713,4 +1714,106 @@ describe('Percy', () => {
       });
     });
   });
+  describe('#validateSnapshotOptions', () => {
+    it('normalizes snapshot options to camelCase and does not produce errors', async () => {
+      const options = {
+        name: 'Snapshot 1',
+        url: 'http://localhost:8000',
+        'scope-options': { scroll: true },
+        'min-height': 1024,
+        'enable-javascript': true,
+        'client-info': 'client-info',
+        'environment-info': 'env-info',
+        'test-case': 'testCase',
+        'th-test-case-execution-id': '12345',
+      };
+
+      const result = validateSnapshotOptions(options);
+      expect(result).toEqual({
+        clientInfo: 'client-info',
+        environmentInfo: 'env-info',
+        name: 'Snapshot 1',
+        url: 'http://localhost:8000',
+        scopeOptions: { scroll: true },
+        minHeight: 1024,
+        enableJavaScript: true,
+        testCase: 'testCase',
+        thTestCaseExecutionId: '12345',
+      });
+    });
+
+    it('handles different casing formats and does not produce errors', async () => {
+      const options = {
+        Name: 'Snapshot 1',
+        url: 'http://localhost:8000',
+        WIDTHS: [375, 1280],
+        Scope: '#app',
+        ScopeOptions: { scroll: true },
+        MinHeight: 1024,
+        EnableJavaScript: true,
+        EnableLayout: false,
+        ClientInfo: 'client-info',
+        EnvironmentInfo: 'env-info',
+        Sync: true,
+        TestCase: 'testCase',
+        Labels: 'label1',
+        ThTestCaseExecutionId: '12345',
+      };
+
+      const result = validateSnapshotOptions(options);
+      expect(result).toEqual({
+        clientInfo: 'client-info',
+        environmentInfo: 'env-info',
+        name: 'Snapshot 1',
+        url: 'http://localhost:8000',
+        widths: [375, 1280],
+        scope: '#app',
+        scopeOptions: { scroll: true },
+        minHeight: 1024,
+        enableJavaScript: true,
+        enableLayout: false,
+        sync: true,
+        testCase: 'testCase',
+        labels: 'label1',
+        thTestCaseExecutionId: '12345',
+      });
+    });
+
+    it('handles mixed casing and special characters and does not produce errors', async () => {
+      const options = {
+        nAmE: 'Snapshot 1',
+        url: 'http://localhost:8000',
+        WiDtHs: [375, 1280],
+        sCoPe: '#app',
+        sCoPeOpTiOnS: { scroll: true },
+        mInHeIgHt: 1024,
+        eNaBlEJaVaScRiPt: true,
+        eNaBlELaYoUt: false,
+        cLiEnTInFo: 'client-info',
+        eNvIrOnMeNtInFo: 'env-info',
+        sYnC: true,
+        tEsTcAsE: 'testCase',
+        lAbElS: 'label1',
+        tHtEsTcAsEeXeCuTiOnId: '12345',
+      };
+
+      const result = validateSnapshotOptions(options);
+      expect(result).toEqual({
+        clientInfo: 'client-info',
+        environmentInfo: 'env-info',
+        name: 'Snapshot 1',
+        url: 'http://localhost:8000',
+        widths: [375, 1280],
+        scope: '#app',
+        scopeOptions: { scroll: true },
+        minHeight: 1024,
+        enableJavaScript: true,
+        enableLayout: false,
+        sync: true,
+        testCase: 'testCase',
+        labels: 'label1',
+        thTestCaseExecutionId: '12345',
+      });
+    });
+  });
 });