vue Architecture Docs
Home / File/ stylePluginScoped.spec.ts — vue Source File

stylePluginScoped.spec.ts — vue Source File

Architecture documentation for stylePluginScoped.spec.ts, a typescript file in the vue codebase. 2 imports, 0 dependents.

File typescript SfcCompiler 2 imports

Entity Profile

Dependency Diagram

graph LR
  356a57c1_72c1_03b6_ea6a_d5b2aeea245d["stylePluginScoped.spec.ts"]
  1aad1b66_4ff0_fcc3_9eab_fd33ebad4a4c["compileStyle.ts"]
  356a57c1_72c1_03b6_ea6a_d5b2aeea245d --> 1aad1b66_4ff0_fcc3_9eab_fd33ebad4a4c
  67f843de_b809_a79f_38cf_cf69959495f7["compileStyle"]
  356a57c1_72c1_03b6_ea6a_d5b2aeea245d --> 67f843de_b809_a79f_38cf_cf69959495f7
  style 356a57c1_72c1_03b6_ea6a_d5b2aeea245d fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { compileStyle } from '../src/compileStyle'

// vue-loader/#1370
test('spaces after selector', () => {
  const { code } = compileStyle({
    source: `.foo , .bar { color: red; }`,
    filename: 'test.css',
    id: 'test'
  })

  expect(code).toMatch(`.foo[test], .bar[test] { color: red;`)
})

test('leading deep selector', () => {
  const { code } = compileStyle({
    source: `>>> .foo { color: red; }`,
    filename: 'test.css',
    id: 'test'
  })

  expect(code).toMatch(`[test] .foo { color: red;`)
})

test('scoped css', () => {
  const { code: style } = compileStyle({
    id: 'v-scope-xxx',
    scoped: true,
    filename: 'example.vue',
    source: `
.test {
  color: yellow;
}
.test:after {
  content: 'bye!';
}
h1 {
  color: green;
}
.anim {
  animation: color 5s infinite, other 5s;
}
.anim-2 {
  animation-name: color;
  animation-duration: 5s;
}
.anim-3 {
  animation: 5s color infinite, 5s other;
}
.anim-multiple {
  animation: color 5s infinite, opacity 2s;
}
.anim-multiple-2 {
  animation-name: color, opacity;
  animation-duration: 5s, 2s;
}

@keyframes color {
  from { color: red; }
  to { color: green; }
}
// ... (78 more lines)

Domain

Dependencies

Source

Frequently Asked Questions

What does stylePluginScoped.spec.ts do?
stylePluginScoped.spec.ts is a source file in the vue codebase, written in typescript. It belongs to the SfcCompiler domain.
What does stylePluginScoped.spec.ts depend on?
stylePluginScoped.spec.ts imports 2 module(s): compileStyle, compileStyle.ts.
Where is stylePluginScoped.spec.ts in the architecture?
stylePluginScoped.spec.ts is located at packages/compiler-sfc/test/stylePluginScoped.spec.ts (domain: SfcCompiler, directory: packages/compiler-sfc/test).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free