test(define): add playground tests

vitejs · Sep 1, 2022 · 46a291b · 46a291b
1 parent e41792a
commit 46a291b
Show file tree

Hide file tree

Showing 4 changed files with 54 additions and 89 deletions.
diff --git a/playground/define/__tests__/define.spec.ts b/playground/define/__tests__/define.spec.ts
@@ -76,66 +76,20 @@ test('ignores constants in string literals', async () => {
       '.ignores-string-literals .__vite_process_env_NODE_ENV'
     )
   ).toBe('__vite_process_env_NODE_ENV')
-  expect(
-    await page.textContent('.ignores-string-literals .import-meta-env-dot')
-  ).toBe('import.meta.env.')
-  expect(
-    await page.textContent('.ignores-string-literals .import-meta-env')
-  ).toBe('import.meta.env')
   expect(
     await page.textContent('.ignores-string-literals .import-meta-hot')
-  ).toBe('import.meta.hot')
+  ).toBe('import' + '.meta.hot')
 })
 
-test('replaces strings in template literal expressions', async () => {
+test('replaces constants in template literal expressions', async () => {
   expect(
     await page.textContent(
       '.replaces-constants-in-template-literal-expressions .process-env-dot'
     )
-  ).toBe(defines.process.env.SOMEVAR)
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .global-process-env-dot'
-    )
-  ).toBe(defines.process.env.SOMEVAR)
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .globalThis-process-env-dot'
-    )
-  ).toBe(defines.process.env.SOMEVAR)
+  ).toBe(JSON.parse(defines['process.env.SOMEVAR']))
   expect(
     await page.textContent(
       '.replaces-constants-in-template-literal-expressions .process-env-NODE_ENV'
     )
-  ).toBe('"test"')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .global-process-env-NODE_ENV'
-    )
-  ).toBe('"test"')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .globalThis-process-env-NODE_ENV'
-    )
-  ).toBe('"test"')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .__vite_process_env_NODE_ENV'
-    )
-  ).toBe('"test"')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .import-meta-env-dot'
-    )
-  ).toBe(defines.process.env.SOMEVAR)
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .import-meta-env'
-    )
-  ).toBe('({})')
-  expect(
-    await page.textContent(
-      '.replaces-constants-in-template-literal-expressions .import-meta-hot'
-    )
-  ).toBe('false')
+  ).toBe('dev')
 })
diff --git a/playground/define/index.html b/playground/define/index.html
@@ -38,8 +38,6 @@ <h2>Define ignores string literals</h2>
     __vite_process_env_NODE_ENV
     <code class="__vite_process_env_NODE_ENV"></code>
   </p>
-  <p>import.meta.env. <code class="import-meta-env-dot"></code></p>
-  <p>import.meta.env <code class="import-meta-env"></code></p>
   <p>import.meta.hot <code class="import-meta-hot"></code></p>
 </section>
 
@@ -63,8 +61,6 @@ <h2>Define replaces constants in template literal expressions</h2>
     __vite_process_env_NODE_ENV
     <code class="__vite_process_env_NODE_ENV"></code>
   </p>
-  <p>import.meta.env. <code class="import-meta-env-dot"></code></p>
-  <p>import.meta.env <code class="import-meta-env"></code></p>
   <p>import.meta.hot <code class="import-meta-hot"></code></p>
 </section>
 
@@ -124,53 +120,19 @@ <h2>Define replaces constants in template literal expressions</h2>
     'globalThis.process.env.NODE_ENV'
   )
   text(
-    '.ignores-string-literals .vite-process-env-NODE_ENV',
+    '.ignores-string-literals .__vite_process_env_NODE_ENV',
     '__vite_process_env_NODE_ENV'
   )
-  text('.ignores-string-literals .import-meta-env-dot', 'import.meta.env.')
-  text('.ignores-string-literals .import-meta-env', 'import.meta.env')
   text('.ignores-string-literals .import-meta-hot', 'import.meta.hot')
 
   text(
     '.replaces-constants-in-template-literal-expressions .process-env-dot',
     `${process.env.SOMEVAR}`
   )
-  text(
-    '.replaces-constants-in-template-literal-expressions .global-process-env-dot',
-    `${global.process.env.SOMEVAR}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .globalThis-process-env-dot',
-    `${globalThis.process.env.SOMEVAR}`
-  )
   text(
     '.replaces-constants-in-template-literal-expressions .process-env-NODE_ENV',
     `${process.env.NODE_ENV}`
   )
-  text(
-    '.replaces-constants-in-template-literal-expressions .global-process-env-NODE_ENV',
-    `${global.process.env.NODE_ENV}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .globalThis-process-env-NODE_ENV',
-    `${globalThis.process.env.NODE_ENV}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .vite-process-env-NODE_ENV',
-    `${__vite_process_env_NODE_ENV}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .import-meta-env-dot',
-    `${import.meta.env.SOMEVAR}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .import-meta-env',
-    `${import.meta.env}`
-  )
-  text(
-    '.replaces-constants-in-template-literal-expressions .import-meta-hot',
-    `${import.meta.hot}`
-  )
 </script>
 
 <style>

diff --git a/playground/env/__tests__/env.spec.ts b/playground/env/__tests__/env.spec.ts
@@ -23,6 +23,10 @@ test('custom', async () => {
   expect(await page.textContent('.custom')).toBe('1')
 })
 
+test('custom in template literal expression', async () => {
+  expect(await page.textContent('.custom-template-literal-exp')).toBe('1')
+})
+
 test('custom-prefix', async () => {
   expect(await page.textContent('.custom-prefix')).toBe('1')
 })
@@ -58,8 +62,30 @@ test('env object', async () => {
   })
 })
 
+test('env object in template literal expression', async () => {
+  const envText = await page.textContent('.env-object-in-template-literal-exp')
+  expect(JSON.parse(envText)).toMatchObject({
+    VITE_EFFECTIVE_MODE_FILE_NAME: `.env.${mode}`,
+    CUSTOM_PREFIX_ENV_VARIABLE: '1',
+    VITE_CUSTOM_ENV_VARIABLE: '1',
+    BASE_URL: '/env/',
+    MODE: mode,
+    DEV: !isBuild,
+    PROD: isBuild
+  })
+})
+
 if (!isBuild) {
   test('relative url import script return import.meta.url', async () => {
     expect(await page.textContent('.url')).toMatch('/env/index.js')
   })
 }
+
+test('ignores import' + '.meta.env in string literals', async () => {
+  expect(await page.textContent('.ignores-literal-import-meta-env-dot')).toBe(
+    'import' + '.meta.env.'
+  )
+  expect(await page.textContent('.ignores-literal-import-meta-env')).toBe(
+    'import' + '.meta.env'
+  )
+})
diff --git a/playground/env/index.html b/playground/env/index.html
@@ -4,6 +4,10 @@ <h1>Environment Variables</h1>
 <p>import.meta.env.DEV: <code class="dev"></code></p>
 <p>import.meta.env.PROD: <code class="prod"></code></p>
 <p>import.meta.env.VITE_CUSTOM_ENV_VARIABLE: <code class="custom"></code></p>
+<p>
+  ${import.meta.env.VITE_CUSTOM_ENV_VARIABLE}:
+  <code class="custom-template-literal-exp"></code>
+</p>
 <p>
   import.meta.env.CUSTOM_PREFIX_ENV_VARIABLE:
   <code class="custom-prefix"></code>
@@ -15,20 +19,39 @@ <h1>Environment Variables</h1>
 <p>typeof import.meta.env.VITE_BOOL: <code class="bool"></code></p>
 <p>process.env.NODE_ENV: <code class="node-env"></code></p>
 <p>import.meta.env: <span class="pre env-object"></span></p>
+<p>
+  ${import.meta.env}:
+  <span class="pre env-object-in-template-literal-exp"></span>
+</p>
 <p>import.meta.url: <span class="pre url"></span></p>
 
+<p>
+  import.meta.env. <code class="ignores-literal-import-meta-env-dot"></code>
+</p>
+<p>import.meta.env <code class="ignores-literal-import-meta-env"></code></p>
+
 <script type="module">
   text('.base', import.meta.env.BASE_URL)
   text('.mode', import.meta.env.MODE)
   text('.dev', import.meta.env.DEV)
   text('.prod', import.meta.env.PROD)
   text('.custom', import.meta.env.VITE_CUSTOM_ENV_VARIABLE)
+  text(
+    '.custom-template-literal-exp',
+    `${import.meta.env.VITE_CUSTOM_ENV_VARIABLE}`
+  )
   text('.custom-prefix', import.meta.env.CUSTOM_PREFIX_ENV_VARIABLE)
   text('.mode-file', import.meta.env.VITE_EFFECTIVE_MODE_FILE_NAME)
   text('.inline', import.meta.env.VITE_INLINE)
   text('.bool', typeof import.meta.env.VITE_BOOL)
   text('.node-env', process.env.NODE_ENV)
   text('.env-object', JSON.stringify(import.meta.env, null, 2))
+  text(
+    '.env-object-in-template-literal-exp',
+    `${JSON.stringify(import.meta.env, null, 2)}`
+  )
+  text('.ignores-literal-import-meta-env-dot', 'import' + '.meta.env.')
+  text('.ignores-literal-import-meta-env', 'import' + '.meta.env')
 
   function text(el, text) {
     document.querySelector(el).textContent = text