sassTest() — vite Function Reference

Architecture documentation for the sassTest() function in sass-tests.ts from the vite codebase.

Function typescript ViteCore ConfigEngine called by 1

Entity Profile

ViteCore→ ConfigEngine→ sassTest() — vite Function Reference

Dependency Diagram

graph TD
  c1f2d498_99c4_6a3b_7efe_b6405c4b5604["sassTest()"]
  48f28f67_4a5c_e42b_f942_68d103bdd95b["sass-tests.ts"]
  c1f2d498_99c4_6a3b_7efe_b6405c4b5604 -->|defined in| 48f28f67_4a5c_e42b_f942_68d103bdd95b
  d2817fdd_4dd1_2a8b_dd89_2038bea82b33["tests()"]
  d2817fdd_4dd1_2a8b_dd89_2038bea82b33 -->|calls| c1f2d498_99c4_6a3b_7efe_b6405c4b5604
  style c1f2d498_99c4_6a3b_7efe_b6405c4b5604 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

playground/css/__tests__/sass-tests.ts lines 4–79

export const sassTest = () => {
  test('sass', async () => {
    const imported = await page.$('.sass')
    const atImport = await page.$('.sass-at-import')
    const atImportAlias = await page.$('.sass-at-import-alias')
    const atImportRelative = await page.$('.sass-at-import-relative')
    const atImportReplacementAlias = await page.$(
      '.sass-at-import-replacement-alias',
    )
    const urlStartsWithVariable = await page.$('.sass-url-starts-with-variable')
    const urlStartsWithVariableInterpolation1 = await page.$(
      '.sass-url-starts-with-interpolation1',
    )
    const urlStartsWithVariableInterpolation2 = await page.$(
      '.sass-url-starts-with-interpolation2',
    )
    const urlStartsWithVariableConcat = await page.$(
      '.sass-url-starts-with-variable-concat',
    )
    const urlStartsWithFunctionCall = await page.$(
      '.sass-url-starts-with-function-call',
    )
    const partialImport = await page.$('.sass-partial')

    expect(await getColor(imported)).toBe('orange')
    expect(await getColor(atImport)).toBe('olive')
    expect(await getBg(atImport)).toMatch(
      isBuild ? /base64/ : '/nested/icon.png',
    )
    expect(await getColor(atImportAlias)).toBe('olive')
    expect(await getBg(atImportAlias)).toMatch(
      isBuild ? /base64/ : '/nested/icon.png',
    )
    expect(await getColor(atImportRelative)).toBe('olive')
    expect(await getBg(atImportRelative)).toMatch(
      isBuild ? /base64/ : '/nested/icon.png',
    )
    expect(await getColor(atImportReplacementAlias)).toBe('olive')
    expect(await getBg(urlStartsWithVariable)).toMatch(
      isBuild ? /ok-[-\w]+\.png/ : `${viteTestUrl}/ok.png`,
    )
    expect(await getBg(urlStartsWithVariableInterpolation1)).toMatch(
      isBuild ? /ok-[-\w]+\.png/ : `${viteTestUrl}/ok.png`,
    )
    expect(await getBg(urlStartsWithVariableInterpolation2)).toMatch(
      isBuild ? /ok-[-\w]+\.png/ : `${viteTestUrl}/ok.png`,
    )
    expect(await getBg(urlStartsWithVariableConcat)).toMatch(
      isBuild ? /ok-[-\w]+\.png/ : `${viteTestUrl}/ok.png`,
    )
    expect(await getBg(urlStartsWithFunctionCall)).toMatch(
      isBuild ? /ok-[-\w]+\.png/ : `${viteTestUrl}/ok.png`,
    )
    expect(await getColor(partialImport)).toBe('orchid')
    expect(await getColor(await page.$('.sass-file-absolute'))).toBe('orange')
    expect(await getColor(await page.$('.sass-dir-index'))).toBe('orange')
    expect(await getColor(await page.$('.sass-root-relative'))).toBe('orange')

    if (isBuild) return

    editFile('sass.scss', (code) =>
      code.replace('color: $injectedColor', 'color: red'),
    )
    await expect.poll(() => getColor(imported)).toBe('red')

    editFile('nested/_index.scss', (code) =>
      code.replace('color: olive', 'color: blue'),
    )
    await expect.poll(() => getColor(atImport)).toBe('blue')

    editFile('nested/_partial.scss', (code) =>
      code.replace('color: orchid', 'color: green'),
    )
    await expect.poll(() => getColor(partialImport)).toBe('green')
  })
}