vue3-yuanma/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`SFC compile <script setup> <script setup lang="ts"> extract emits 1`] = `
"import { Slots, defineComponent } from 'vue'
declare function __emit__(e: 'foo' | 'bar'): void
      declare function __emit__(e: 'baz', id: number): void
      
export function setup(_: {}, { emit: myEmit }: {
  emit: typeof __emit__,
  slots: Slots,
  attrs: Record<string, any>
}) {

      
return {  }
}

export default defineComponent({
  emits: [\\"foo\\", \\"bar\\", \\"baz\\"] as unknown as undefined,
  setup
})"
`;

exports[`SFC compile <script setup> <script setup lang="ts"> extract props 1`] = `
"import { Slots, defineComponent } from 'vue'
interface Test {}

      type Alias = number[]

      
export function setup(myProps: {
        string: string
        number: number
        boolean: boolean
        object: object
        objectLiteral: { a: number }
        fn: (n: number) => void
        functionRef: Function
        objectRef: Object
        array: string[]
        arrayRef: Array<any>
        tuple: [number, number]
        set: Set<string>
        literal: 'foo'
        optional?: any
        recordRef: Record<string, null>
        interface: Test
        alias: Alias

        union: string | number
        literalUnion: 'foo' | 'bar'
        literalUnionMixed: 'foo' | 1 | boolean
        intersection: Test & {}
      }) {

      
return {  }
}

export default defineComponent({
  props: {
    string: { type: String, required: true },
    number: { type: Number, required: true },
    boolean: { type: Boolean, required: true },
    object: { type: Object, required: true },
    objectLiteral: { type: Object, required: true },
    fn: { type: Function, required: true },
    functionRef: { type: Function, required: true },
    objectRef: { type: Object, required: true },
    array: { type: Array, required: true },
    arrayRef: { type: Array, required: true },
    tuple: { type: Array, required: true },
    set: { type: Set, required: true },
    literal: { type: String, required: true },
    optional: { type: null, required: false },
    recordRef: { type: Object, required: true },
    interface: { type: Object, required: true },
    alias: { type: Array, required: true },
    union: { type: [String, Number], required: true },
    literalUnion: { type: [String, String], required: true },
    literalUnionMixed: { type: [String, Number, Boolean], required: true },
    intersection: { type: Object, required: true }
  } as unknown as undefined,
  setup
})"
`;

exports[`SFC compile <script setup> <script setup lang="ts"> hoist type declarations 1`] = `
"import { Slots, defineComponent } from 'vue'
export interface Foo {}
        type Bar = {}
      
export function setup() {

        
return {  }
}

export default defineComponent({
  setup
})"
`;

exports[`SFC compile <script setup> CSS vars injection <script> w/ default export 1`] = `
"const __default__ = { setup() {} }
import { useCssVars as __useCssVars__ } from 'vue'
const __injectCSSVars__ = () => {
__useCssVars__(_ctx => ({ color: _ctx.color }))
}
const __setup__ = __default__.setup
__default__.setup = __setup__
  ? (props, ctx) => { __injectCSSVars__();return __setup__(props, ctx) }
  : __injectCSSVars__
export default __default__"
`;

exports[`SFC compile <script setup> CSS vars injection <script> w/ default export in strings/comments 1`] = `
"
          // export default {}
          const __default__ = {}
        
import { useCssVars as __useCssVars__ } from 'vue'
const __injectCSSVars__ = () => {
__useCssVars__(_ctx => ({ color: _ctx.color }))
}
const __setup__ = __default__.setup
__default__.setup = __setup__
  ? (props, ctx) => { __injectCSSVars__();return __setup__(props, ctx) }
  : __injectCSSVars__
export default __default__"
`;

exports[`SFC compile <script setup> CSS vars injection <script> w/ no default export 1`] = `
"const a = 1
const __default__ = {}
import { useCssVars as __useCssVars__ } from 'vue'
const __injectCSSVars__ = () => {
__useCssVars__(_ctx => ({ color: _ctx.color }))
}
const __setup__ = __default__.setup
__default__.setup = __setup__
  ? (props, ctx) => { __injectCSSVars__();return __setup__(props, ctx) }
  : __injectCSSVars__
export default __default__"
`;

exports[`SFC compile <script setup> CSS vars injection w/ <script setup> 1`] = `
"import { useCssVars } from 'vue'

export function setup() {
const color = 'red'
__useCssVars__(_ctx => ({ color }))
return { color }
}

export default { setup }"
`;

exports[`SFC compile <script setup> errors should allow export default referencing imported binding 1`] = `
"import { bar } from './bar'
          
export function setup() {

          
return { bar }
}

const __default__ = {
            props: {
              foo: {
                default: () => bar
              }
            }
          }
        __default__.setup = setup
export default __default__"
`;

exports[`SFC compile <script setup> errors should allow export default referencing scope var 1`] = `
"export function setup() {

          const bar = 1
          
return { bar }
}

const __default__ = {
            props: {
              foo: {
                default: bar => bar + 1
              }
            }
          }
        __default__.setup = setup
export default __default__"
`;

exports[`SFC compile <script setup> explicit setup signature 1`] = `
"export function setup(props, { emit }) {
emit('foo')
return {  }
}

export default { setup }"
`;

exports[`SFC compile <script setup> imports dedupe between user & helper 1`] = `
"import { ref } from 'vue'
  
export function setup() {

  const foo = ref(1)
  
return { ref, foo }
}

export default { setup }"
`;

exports[`SFC compile <script setup> imports import dedupe between <script> and <script setup> 1`] = `
"import { x } from './x'
        
export function setup() {

        x()
        
return { x }
}

export default { setup }"
`;

exports[`SFC compile <script setup> imports should extract comment for import or type declarations 1`] = `
"import a from 'a' // comment
  import b from 'b'
  
export function setup() {

  
return { a, b }
}

export default { setup }"
`;

exports[`SFC compile <script setup> imports should hoist and expose imports 1`] = `
"import { ref } from 'vue'
export function setup() {

return { ref }
}

export default { setup }"
`;

exports[`SFC compile <script setup> ref: syntax sugar accessing ref binding 1`] = `
"import { ref } from 'vue'

export function setup() {

      const a = ref(1)
      console.log(a.value)
      function get() {
        return a.value + 1
      }
      
return { a, get }
}

export default { setup }"
`;

exports[`SFC compile <script setup> ref: syntax sugar array destructure 1`] = `
"import { ref } from 'vue'

export function setup() {

      const n = ref(1), [__a, __b = 1, ...__c] = useFoo()
const a = ref(__a);
const b = ref(__b);
const c = ref(__c);
      console.log(n.value, a.value, b.value, c.value)
      
return { n, a, b, c }
}

export default { setup }"
`;

exports[`SFC compile <script setup> ref: syntax sugar convert ref declarations 1`] = `
"import { ref } from 'vue'

export function setup() {

      const foo = ref()
      const a = ref(1)
      const b = ref({
        count: 0
      })
      let c = () => {}
      let d
      
return { foo, a, b, c, d }
}

export default { setup }"
`;

exports[`SFC compile <script setup> ref: syntax sugar multi ref declarations 1`] = `
"import { ref } from 'vue'

export function setup() {

      const a = ref(1), b = ref(2), c = ref({
        count: 0
      })
      
return { a, b, c }
}

export default { setup }"
`;

exports[`SFC compile <script setup> ref: syntax sugar mutating ref binding 1`] = `
"import { ref } from 'vue'

export function setup() {

      const a = ref(1)
      const b = ref({ count: 0 })
      function inc() {
        a.value++
        a.value = a.value + 1
        b.value.count++
        b.value.count = b.value.count + 1
      }
      
return { a, b, inc }
}

export default { setup }"
`;

exports[`SFC compile <script setup> ref: syntax sugar nested destructure 1`] = `
"import { ref } from 'vue'

export function setup() {

      const [{ a: { b: __b }}] = useFoo()
const b = ref(__b);
      const { c: [__d, __e] } = useBar()
const d = ref(__d);
const e = ref(__e);
      console.log(b.value, d.value, e.value)
      
return { b, d, e }
}

export default { setup }"
`;

exports[`SFC compile <script setup> ref: syntax sugar object destructure 1`] = `
"import { ref } from 'vue'

export function setup() {

      const n = ref(1), { a: __a, b: __c, d: __d = 1, e: __f = 2, ...__g } = useFoo()
const a = ref(__a);
const c = ref(__c);
const d = ref(__d);
const f = ref(__f);
const g = ref(__g);
      console.log(n.value, a.value, c.value, d.value, f.value, g.value)
      
return { n, a, c, d, f, g }
}

export default { setup }"
`;

exports[`SFC compile <script setup> ref: syntax sugar should not convert non ref labels 1`] = `
"export function setup() {

      foo: a = 1, b = 2, c = {
        count: 0
      }
      
return {  }
}

export default { setup }"
`;

exports[`SFC compile <script setup> ref: syntax sugar using ref binding in property shorthand 1`] = `
"import { ref } from 'vue'

export function setup() {

      const a = ref(1)
      const b = { a: a.value }
      function test() {
        const { a } = b
      }
      
return { a, b, test }
}

export default { setup }"
`;

exports[`SFC compile <script setup> should expose top level declarations 1`] = `
"import { x } from './x'
      
export function setup() {

      let a = 1
      const b = 2
      function c() {}
      class d {}
      
return { x, a, b, c, d }
}

export default { setup }"
`;