Fix existing tests

package.json

@@ -81,6 +81,7 @@
     "@rollup/plugin-url": "^8.0.2",
     "@tsconfig/node14": "^14.1.2",
     "@types/cheerio": "^0.22.35",
+    "@types/dom-view-transitions": "^1.0.5",
     "@types/express": "^4.17.21",
     "@types/jest": "^29.5.13",
     "@types/markdown-it": "^14.1.2",

src/templates/bespoke/transition.ts

@@ -11,13 +11,6 @@ interface TransitionCallbackOption {
   cond: (e: any) => boolean
 }
 
-interface ViewTransition {
-  finished: Promise<void>
-  ready: Promise<void>
-  skipTransition: () => void
-  updateCallbackDone: Promise<void>
-}
-
 export const transitionStyleId = '_tSId' as const
 
 const transitionApply = '_tA' as const
@@ -47,7 +40,7 @@ const reducedKeyframes: MarpTransitionKeyframes = {
 }
 
 const bespokeTransition = (deck) => {
-  if (!document['startViewTransition']) return
+  if (!document.startViewTransition) return
 
   const transitionDuringState = (
     value?: boolean | ViewTransition
@@ -189,8 +182,7 @@ const bespokeTransition = (deck) => {
         try {
           transitionDuringState(true) // to prevent unexpected navigation
 
-          const transition: ViewTransition =
-            document['startViewTransition'](navigate)
+          const transition = document.startViewTransition(navigate)
 
           transitionDuringState(transition)
           transition.finished.finally(finalize)

src/utils/puppeteer.ts

@@ -9,6 +9,7 @@ import { findChromeInstallation } from './chrome-finder'
 import { isInsideContainer } from './container'
 import { findEdgeInstallation } from './edge-finder'
 import { isWSL, resolveWindowsEnv } from './wsl'
+import { nanoid } from 'nanoid'
 
 let executablePath: string | undefined | false = false
 let wslTmp: string | undefined
@@ -48,18 +49,23 @@ const isSnapBrowser = (executablePath: string | undefined) => {
   return false
 }
 
+const puppeteerDataDirSuffix = nanoid(10)
+
 export const generatePuppeteerDataDirPath = async (
   name: string,
   { wslHost }: { wslHost?: boolean } = {}
 ): Promise<string> => {
+  const nameWithSuffix = `${name}-${puppeteerDataDirSuffix}`
+
   const dataDir = await (async () => {
     if ((await isWSL()) && wslHost) {
       // In WSL environment, Marp CLI may use Chrome on Windows. If Chrome has
       // located in host OS (Windows), we have to specify Windows path.
       if (wslTmp === undefined) wslTmp = await resolveWindowsEnv('TMP')
-      if (wslTmp !== undefined) return path.win32.resolve(wslTmp, name)
+      if (wslTmp !== undefined)
+        return path.win32.resolve(wslTmp, nameWithSuffix)
     }
-    return path.resolve(os.tmpdir(), name)
+    return path.resolve(os.tmpdir(), nameWithSuffix)
   })()
 
   // Ensure the data directory is created

test/_browser/viewTransition.ts

@@ -28,7 +28,7 @@ beforeEach(() => {
 
 afterEach(() => {
   if ('startViewTransition' in document) {
-    delete document.startViewTransition
+    delete (document as any).startViewTransition
   }
 })
 

test/_configs/basic/md.md

@@ -1 +1 @@
-<b>html</b>
+<b>html<button>button</button></b>

test/_files/themes/a.css

@@ -1 +1,5 @@
-/* @theme a */
+/** @theme a */
+
+section {
+  --theme-a: true;
+}

test/_files/themes/b.css

@@ -1 +1,5 @@
-/* @theme b */
+/** @theme b */
+
+section {
+  --theme-b: true;
+}

test/_files/themes/nested/c.css

@@ -1 +1,5 @@
-/* @theme c */
+/** @theme c */
+
+section {
+  --theme-c: true;
+}

test/converter.ts

@@ -138,14 +138,21 @@ describe('Converter', () => {
     })
 
     it("overrides html option by converter's html option", async () => {
-      const defaultHtml = (await instance().convert('<i><br></i>')).rendered
-      expect(defaultHtml.html).toContain('&lt;i&gt;<br />&lt;/i&gt;')
+      const htmlMd = '<i><br><button>test</button></i>'
 
-      const enabled = (await instance({ html: true }).convert(md)).rendered
-      expect(enabled.html).toContain('<i>Hello!</i>')
+      const defaultHtml = (await instance().convert(htmlMd)).rendered
+      expect(defaultHtml.html).toContain(
+        '<i><br />&lt;button&gt;test&lt;/button&gt;</i>'
+      )
+
+      const enabled = (await instance({ html: true }).convert(htmlMd)).rendered
+      expect(enabled.html).toContain('<i><br /><button>test</button></i>')
 
-      const disabled = (await instance({ html: false }).convert(md)).rendered
-      expect(disabled.html).toContain('&lt;i&gt;Hello!&lt;/i&gt;')
+      const disabled = (await instance({ html: false }).convert(htmlMd))
+        .rendered
+      expect(disabled.html).toContain(
+        '&lt;i&gt;&lt;br&gt;&lt;button&gt;test&lt;/button&gt;&lt;/i&gt;'
+      )
     })
 
     it('correctly applies overridden global directives even if enabled HTML option', async () => {

test/marp-cli.ts

@@ -357,7 +357,7 @@ describe('Marp CLI', () => {
         expect(await marpCli(['--input-dir', files, '--theme', 'a'])).toBe(0)
 
         for (const [, buffer] of writeFile.mock.calls) {
-          expect(buffer.toString()).toContain('/* @theme a */')
+          expect(buffer.toString()).toContain('--theme-a')
         }
       } finally {
         info.mockRestore()
@@ -561,7 +561,7 @@ describe('Marp CLI', () => {
         expect(await marpCli(args)).toBe(0)
 
         const { css } = (await convert.mock.results[0].value).rendered
-        expect(css).toContain('/* @theme a */')
+        expect(css).toContain('--theme-a')
 
         const converter: Converter = convert.mock.instances[0]
         const { themeSet } = converter.options
@@ -630,7 +630,7 @@ describe('Marp CLI', () => {
         expect(convert).toHaveBeenCalledTimes(1)
 
         const { css } = (await convert.mock.results[0].value).rendered
-        expect(css).toContain('@theme a')
+        expect(css).toContain('--theme-a')
         expect(observeSpy).toHaveBeenCalledWith(filePath, 'a')
       })
     })
@@ -646,7 +646,7 @@ describe('Marp CLI', () => {
           expect(await marpCli([...baseArgs, '--theme', name])).toBe(0)
           expect(convert).toHaveBeenCalledTimes(1)
           expect((await convert.mock.results[0].value).rendered.css).toContain(
-            `@theme ${name}`
+            `--theme-${name}`
           )
           expect(observeSpy).toHaveBeenCalledWith(filePath, name)
         }
@@ -664,7 +664,7 @@ describe('Marp CLI', () => {
           expect(await marpCli([...baseArgs(themes), '--theme', name])).toBe(0)
           expect(convert).toHaveBeenCalledTimes(1)
           expect((await convert.mock.results[0].value).rendered.css).toContain(
-            `@theme ${name}`
+            `--theme-${name}`
           )
           expect(observeSpy).toHaveBeenCalledWith(filePath, name)
         }
@@ -980,7 +980,7 @@ describe('Marp CLI', () => {
           expect(await marpCli(['md.md'])).toBe(0)
 
           const html = stdout.mock.calls[0][0].toString()
-          expect(html).toContain('<b>html</b>')
+          expect(html).toContain('<b>html<button>button</button></b>')
         } finally {
           stdout.mockRestore()
           warn.mockRestore()
@@ -1002,9 +1002,11 @@ describe('Marp CLI', () => {
 
             expect(await marpCli(['md.md', opt, '-o', '-'])).toBe(0)
 
-            // html option in a configuration file should not work
+            // html option in a configuration file should not work, and not allowed element should be escaped
             const html = stdout.mock.calls[0][0].toString()
-            expect(html).toContain('&lt;b&gt;html&lt;/b&gt;')
+            expect(html).toContain(
+              '<b>html&lt;button&gt;button&lt;/button&gt;</b>'
+            )
           }
         } finally {
           stdout.mockRestore()
@@ -1025,7 +1027,7 @@ describe('Marp CLI', () => {
           expect(await marpCli(['md.md', '-o', '-'])).toBe(0)
 
           const html = stdout.mock.calls[0][0].toString()
-          expect(html).toContain('@theme b')
+          expect(html).toContain('--theme-b')
         } finally {
           stdout.mockRestore()
           warn.mockRestore()
@@ -1065,7 +1067,7 @@ describe('Marp CLI', () => {
             )
 
             const html = stdout.mock.calls[0][0].toString()
-            expect(html).toContain('@theme a')
+            expect(html).toContain('--theme-a')
           } finally {
             stdout.mockRestore()
             warn.mockRestore()

test/server.ts

@@ -1,7 +1,8 @@
-import path from 'path'
+import { ClientRequest } from 'node:http'
+import path from 'node:path'
 import Marp from '@marp-team/marp-core'
 import { load } from 'cheerio'
-import express from 'express'
+import express, { type Express } from 'express'
 import request from 'supertest'
 import {
   Converter,
@@ -105,7 +106,9 @@ describe('Server', () => {
   })
 
   describe('Routing', () => {
-    const setupServer = async (opts: Server.Options = {}): Promise<Server> => {
+    const setupServer = async (
+      opts: Server.Options = {}
+    ): Promise<Server & { server: Express }> => {
       const server: any = new Server(converter(), opts)
 
       await server.setup() // Setup server without listening
@@ -264,11 +267,22 @@ describe('Server', () => {
     })
 
     describe('when the directory traversal attack is detected', () => {
-      it('returns 403', async () => {
+      it('returns 404', async () => {
         const server = await setupServer()
         const response = await request(server.server).get('/../../README.md')
 
-        expect(response.status).toBe(403)
+        // Current express is recognized directory traversal attack, and normalize request path to `/README.md`.
+        // So prevention logic of Marp CLI (returns 403) is not passed now.
+        // expect(response.status).toBe(403)
+        expect(response.status).toBe(404)
+      })
+
+      it('normalizes the request path that is trying directory traversal attack', async () => {
+        const server = await setupServer()
+        const response = await request(server.server).get('/../../4.txt')
+
+        expect((response.request.req as ClientRequest).path).toBe('/4.txt')
+        expect(response.status).toBe(200)
       })
     })
   })