[test optimization] support TypeScript 6 in browser integration tests

integration-tests/cypress/cypress-atr.spec.js

@@ -94,10 +94,7 @@ moduleTypes.forEach(({
 
     // cypress-fail-fast is required as an incompatible plugin.
     // typescript is required to compile .cy.ts spec files in the pre-compiled JS tests.
-    // typescript@5 is pinned because typescript@6 emits "use strict" on line 1 for
-    // non-module files, shifting compiled line numbers and breaking source map resolution.
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript@5'], true)
+    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript'], true)
 
     before(async function () {
       // Note: Cypress binary is already installed during useSandbox() via the postinstall script

integration-tests/cypress/cypress-efd.spec.js

@@ -91,10 +91,7 @@ moduleTypes.forEach(({
 
     // cypress-fail-fast is required as an incompatible plugin.
     // typescript is required to compile .cy.ts spec files in the pre-compiled JS tests.
-    // typescript@5 is pinned because typescript@6 emits "use strict" on line 1 for
-    // non-module files, shifting compiled line numbers and breaking source map resolution.
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript@5'], true)
+    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript'], true)
 
     before(async function () {
       // Note: Cypress binary is already installed during useSandbox() via the postinstall script

integration-tests/cypress/cypress-final-status.spec.js

@@ -88,10 +88,7 @@ moduleTypes.forEach(({
 
     // cypress-fail-fast is required as an incompatible plugin.
     // typescript is required to compile .cy.ts spec files in the pre-compiled JS tests.
-    // typescript@5 is pinned because typescript@6 emits "use strict" on line 1 for
-    // non-module files, shifting compiled line numbers and breaking source map resolution.
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript@5'], true)
+    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript'], true)
 
     before(async function () {
       // Note: Cypress binary is already installed during useSandbox() via the postinstall script

integration-tests/cypress/cypress-impacted-tests.spec.js

@@ -102,10 +102,7 @@ moduleTypes.forEach(({
 
     // cypress-fail-fast is required as an incompatible plugin.
     // typescript is required to compile .cy.ts spec files in the pre-compiled JS tests.
-    // typescript@5 is pinned because typescript@6 emits "use strict" on line 1 for
-    // non-module files, shifting compiled line numbers and breaking source map resolution.
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript@5'], true)
+    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript'], true)
 
     before(async function () {
       // Note: Cypress binary is already installed during useSandbox() via the postinstall script

integration-tests/cypress/cypress-itr.spec.js

@@ -90,10 +90,7 @@ moduleTypes.forEach(({
 
     // cypress-fail-fast is required as an incompatible plugin.
     // typescript is required to compile .cy.ts spec files in the pre-compiled JS tests.
-    // typescript@5 is pinned because typescript@6 emits "use strict" on line 1 for
-    // non-module files, shifting compiled line numbers and breaking source map resolution.
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript@5'], true)
+    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript'], true)
 
     before(async function () {
       // Note: Cypress binary is already installed during useSandbox() via the postinstall script

integration-tests/cypress/cypress-reporting.spec.js

@@ -39,7 +39,10 @@ const {
 const { DD_HOST_CPU_COUNT } = require('../../packages/dd-trace/src/plugins/util/env')
 const { ERROR_MESSAGE, ERROR_TYPE, COMPONENT } = require('../../packages/dd-trace/src/constants')
 const { DD_MAJOR, NODE_MAJOR } = require('../../version')
-const { resolveSourceLineForTest } = require('../../packages/datadog-plugin-cypress/src/source-map-utils')
+const {
+  resolveOriginalSourceFile,
+  resolveSourceLineForTest,
+} = require('../../packages/datadog-plugin-cypress/src/source-map-utils')
 
 const RECEIVER_STOP_TIMEOUT = 20000
 const version = process.env.CYPRESS_VERSION
@@ -59,6 +62,30 @@ function compilePrecompiledTypeScriptSpecs (cwd, env) {
   }
 }
 
+/**
+ * @param {string} cwd
+ * @returns {void}
+ */
+function configureCypressTypeScriptCompilation (cwd) {
+  // Cypress's webpack preprocessor resolves TypeScript config from the spec directory.
+  const tsconfig = {
+    compilerOptions: {
+      rootDir: '.',
+      target: 'ES2020',
+      module: 'commonjs',
+      sourceMap: true,
+      skipLibCheck: true,
+    },
+  }
+
+  const typescriptVersion = require(path.join(cwd, 'node_modules/typescript/package.json')).version
+  if (semver.gte(typescriptVersion, '6.0.0')) {
+    tsconfig.compilerOptions.ignoreDeprecations = '6.0'
+  }
+
+  fs.writeFileSync(path.join(cwd, 'cypress/e2e/tsconfig.json'), JSON.stringify(tsconfig, null, 2))
+}
+
 function shouldTestsRun (type) {
   if (DD_MAJOR === 5) {
     if (NODE_MAJOR <= 16) {
@@ -119,10 +146,7 @@ moduleTypes.forEach(({
 
     // cypress-fail-fast is required as an incompatible plugin.
     // typescript is required to compile .cy.ts spec files in the pre-compiled JS tests.
-    // typescript@5 is pinned because typescript@6 emits "use strict" on line 1 for
-    // non-module files, shifting compiled line numbers and breaking source map resolution.
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript@5'], true)
+    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript'], true)
 
     before(async function () {
       // Note: Cypress binary is already installed during useSandbox() via the postinstall script
@@ -676,6 +700,7 @@ moduleTypes.forEach(({
     )
 
     over10It('reports tests with a TypeScript config file', async () => {
+      let testOutput = ''
       const receiverPromise = receiver
         .gatherPayloadsMaxTimeout(({ url }) => url.endsWith('/api/v2/citestcycle'), (payloads) => {
           const events = payloads
@@ -690,7 +715,13 @@ moduleTypes.forEach(({
               [TEST_STATUS]: 'pass',
               [TEST_FRAMEWORK]: 'cypress',
             },
-          })
+          }, `got events: ${JSON.stringify(events.map(event => ({
+            resource: event.content.resource,
+            sourceFile: event.content.meta?.[TEST_SOURCE_FILE],
+            status: event.content.meta?.[TEST_STATUS],
+            framework: event.content.meta?.[TEST_FRAMEWORK],
+            error: event.content.meta?.[ERROR_MESSAGE],
+          })), null, 2)}\nCypress output:\n${testOutput}`)
         }, 20000)
 
       const envVars = getCiVisAgentlessConfig(receiver.port)
@@ -706,6 +737,12 @@ moduleTypes.forEach(({
           },
         }
       )
+      childProcess.stdout?.on('data', chunk => {
+        testOutput += chunk.toString()
+      })
+      childProcess.stderr?.on('data', chunk => {
+        testOutput += chunk.toString()
+      })
 
       const [[exitCode]] = await Promise.all([
         once(childProcess, 'exit'),
@@ -1294,6 +1331,33 @@ moduleTypes.forEach(({
       }
     })
 
+    over12It('resolves source file when generated first line is unmapped', () => {
+      const tempDir = fs.mkdtempSync(path.join(os.tmpdir(), 'dd-cypress-source-map-'))
+      const compiledFilePath = path.join(tempDir, 'spec-prologue.js')
+      const sourceMapPath = `${compiledFilePath}.map`
+
+      try {
+        fs.writeFileSync(compiledFilePath, [
+          '"use strict";',
+          'it("source mapped title", () => {})',
+          '',
+        ].join('\n'))
+
+        fs.writeFileSync(sourceMapPath, JSON.stringify({
+          version: 3,
+          file: 'spec-prologue.js',
+          sourceRoot: '',
+          sources: ['spec-prologue.ts'],
+          names: [],
+          mappings: ';AAEA',
+        }))
+
+        assert.strictEqual(resolveOriginalSourceFile(compiledFilePath), path.join(tempDir, 'spec-prologue.ts'))
+      } finally {
+        fs.rmSync(tempDir, { recursive: true, force: true })
+      }
+    })
+
     over12It('uses declaration scanning fallback when invocationDetails line is invalid', async function () {
       const envVars = getCiVisAgentlessConfig(receiver.port)
 
@@ -1429,6 +1493,8 @@ moduleTypes.forEach(({
     over12It('reports correct source file and line for typescript test files compiled by cypress', async function () {
       // Remove any pre-compiled dist files to ensure Cypress compiles the .ts file itself
       cleanupPrecompiledSourceLineDist(cwd)
+      configureCypressTypeScriptCompilation(cwd)
+      let testOutput = ''
 
       const receiverPromise = receiver
         .gatherPayloadsMaxTimeout(({ url }) => url.endsWith('/api/v2/citestcycle'), (payloads) => {
@@ -1438,7 +1504,18 @@ moduleTypes.forEach(({
             event.content.resource.includes('spec source line')
           )
 
-          assert.strictEqual(tsTestEvents.length, 2, 'should have two typescript test events')
+          assert.strictEqual(
+            tsTestEvents.length,
+            2,
+            `should have two typescript test events, got events: ${JSON.stringify(events.map(event => ({
+              type: event.type,
+              resource: event.content.resource,
+              sourceFile: event.content.meta?.[TEST_SOURCE_FILE],
+              sourceStart: event.content.metrics?.[TEST_SOURCE_START],
+              status: event.content.meta?.[TEST_STATUS],
+              error: event.content.meta?.[ERROR_MESSAGE],
+            })), null, 2)}\nCypress output:\n${testOutput}`
+          )
 
           const itTestEvent = tsTestEvents.find(e => e.content.resource.includes('reports correct line number'))
           const testTestEvent = tsTestEvents.find(
@@ -1482,6 +1559,12 @@ moduleTypes.forEach(({
           SPEC_PATTERN: 'cypress/e2e/spec-source-line.cy.ts',
         },
       })
+      childProcess.stdout?.on('data', chunk => {
+        testOutput += chunk.toString()
+      })
+      childProcess.stderr?.on('data', chunk => {
+        testOutput += chunk.toString()
+      })
 
       const [[exitCode]] = await Promise.all([once(childProcess, 'exit'), receiverPromise])
       assert.strictEqual(exitCode, 0, 'cypress process should exit successfully')

integration-tests/cypress/cypress-test-management.spec.js

@@ -97,10 +97,7 @@ moduleTypes.forEach(({
 
     // cypress-fail-fast is required as an incompatible plugin.
     // typescript is required to compile .cy.ts spec files in the pre-compiled JS tests.
-    // typescript@5 is pinned because typescript@6 emits "use strict" on line 1 for
-    // non-module files, shifting compiled line numbers and breaking source map resolution.
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript@5'], true)
+    useSandbox([`cypress@${version}`, 'cypress-fail-fast@7.1.0', 'typescript'], true)
 
     before(async function () {
       // Note: Cypress binary is already installed during useSandbox() via the postinstall script

integration-tests/playwright/playwright-active-test-span.spec.js

@@ -50,8 +50,7 @@ versions.forEach((version) => {
     this.retries(2)
     this.timeout(80000)
 
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript@5'], true)
+    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript'], true)
 
     before(function (done) {
       // Increase timeout for this hook specifically to account for slow chromium installation in CI

integration-tests/playwright/playwright-atr.spec.js

@@ -45,8 +45,7 @@ versions.forEach((version) => {
     this.retries(2)
     this.timeout(80000)
 
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript@5'], true)
+    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript'], true)
 
     before(function (done) {
       // Increase timeout for this hook specifically to account for slow chromium installation in CI

integration-tests/playwright/playwright-efd.spec.js

@@ -51,8 +51,7 @@ versions.forEach((version) => {
     this.retries(2)
     this.timeout(80000)
 
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript@5'], true)
+    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript'], true)
 
     before(function (done) {
       // Increase timeout for this hook specifically to account for slow chromium installation in CI

integration-tests/playwright/playwright-impacted-tests.spec.js

@@ -51,8 +51,7 @@ versions.forEach((version) => {
     this.retries(2)
     this.timeout(80000)
 
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript@5'], true)
+    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript'], true)
 
     before(function (done) {
       // Increase timeout for this hook specifically to account for slow chromium installation in CI

integration-tests/playwright/playwright-reporting.spec.js

@@ -57,8 +57,7 @@ versions.forEach((version) => {
     this.retries(2)
     this.timeout(80000)
 
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript@5'], true)
+    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript'], true)
 
     before(function (done) {
       // Increase timeout for this hook specifically to account for slow chromium installation in CI
@@ -279,10 +278,24 @@ versions.forEach((version) => {
       receiver.gatherPayloadsMaxTimeout(({ url }) => url === '/api/v2/citestcycle', payloads => {
         const events = payloads.flatMap(({ payload }) => payload.events)
         const testEvents = events.filter(event => event.type === 'test')
-        assertObjectContains(testEvents.map(test => test.content.resource).sort(), [
+        const expectedResources = [
           'playwright-tests-ts/one-test.js.playwright should work with passing tests',
           'playwright-tests-ts/one-test.js.playwright should work with skipped tests',
-        ])
+        ]
+        const actualResources = testEvents.map(test => test.content.resource).sort()
+        for (const expectedResource of expectedResources) {
+          assert.ok(
+            actualResources.includes(expectedResource),
+            `expected ${expectedResource}, got events: ${JSON.stringify(events.map(event => ({
+              type: event.type,
+              resource: event.content.resource,
+              sourceFile: event.content.meta?.[TEST_SOURCE_FILE],
+              sourceStart: event.content.metrics?.[TEST_SOURCE_START],
+              status: event.content.meta?.[TEST_STATUS],
+              error: event.content.meta?.[ERROR_MESSAGE],
+            })), null, 2)}\nPlaywright output:\n${testOutput}`
+          )
+        }
         assert.deepStrictEqual(
           testEvents
             .map(test => ({

integration-tests/playwright/playwright-test-management.spec.js

@@ -53,8 +53,7 @@ versions.forEach((version) => {
     this.retries(2)
     this.timeout(80000)
 
-    // TODO: Update tests files accordingly and test with different TS versions
-    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript@5'], true)
+    useSandbox([`@playwright/test@${version}`, '@types/node', 'typescript'], true)
 
     before(function (done) {
       // Increase timeout for this hook specifically to account for slow chromium installation in CI

integration-tests/tsconfig.json

@@ -4,7 +4,8 @@
     "module": "commonjs",
     "outDir": "ci-visibility/playwright-tests-ts-out",
     "sourceMap": true,
-    "skipLibCheck": true
+    "skipLibCheck": true,
+    "types": ["node"]
   },
   "include": ["ci-visibility/playwright-tests-ts"],
   "files": ["playwright.config.ts"]