functional.spec.ts — vue Source File

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

File typescript 2 imports

Entity Profile

Dependency Diagram

graph LR
  467bdd21_8ece_10cc_c0ff_b134042ee273["functional.spec.ts"]
  db9e7bef_009d_3918_6e7d_543a36a38d75["vue"]
  467bdd21_8ece_10cc_c0ff_b134042ee273 --> db9e7bef_009d_3918_6e7d_543a36a38d75
  973389ac_8625_30a3_53ce_b1b48fae58c5["vnode"]
  467bdd21_8ece_10cc_c0ff_b134042ee273 --> 973389ac_8625_30a3_53ce_b1b48fae58c5
  style 467bdd21_8ece_10cc_c0ff_b134042ee273 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import Vue from 'vue'
import { createEmptyVNode } from 'core/vdom/vnode'

describe('Options functional', () => {
  it('should work', done => {
    const vm = new Vue({
      data: { test: 'foo' },
      template: '<div><wrap :msg="test">bar</wrap></div>',
      components: {
        wrap: {
          functional: true,
          props: ['msg'],
          render(h, { props, children }) {
            return h('div', null, [props.msg, ' '].concat(children))
          }
        }
      }
    }).$mount()
    expect(vm.$el.innerHTML).toBe('<div>foo bar</div>')
    vm.test = 'qux'
    waitForUpdate(() => {
      expect(vm.$el.innerHTML).toBe('<div>qux bar</div>')
    }).then(done)
  })

  it('should expose all props when not declared', done => {
    const fn = {
      functional: true,
      render(h, { props }) {
        return h('div', `${props.msg} ${props.kebabMsg}`)
      }
    }

    const vm = new Vue({
      data: { test: 'foo' },
      render(h) {
        return h('div', [
          h(fn, {
            props: { msg: this.test },
            attrs: { 'kebab-msg': 'bar' }
          })
        ])
      }
    }).$mount()

    expect(vm.$el.innerHTML).toBe('<div>foo bar</div>')
    vm.test = 'qux'
    waitForUpdate(() => {
      expect(vm.$el.innerHTML).toBe('<div>qux bar</div>')
    }).then(done)
  })

  it('should expose data.on as listeners', () => {
    const foo = vi.fn()
    const bar = vi.fn()
    const vm = new Vue({
      template: '<div><wrap @click="foo" @test="bar"/></div>',
      methods: { foo, bar },
      components: {
        wrap: {
// ... (310 more lines)

Dependencies

vnode
vue

Source

View on GitHub

Frequently Asked Questions

What does functional.spec.ts do?

functional.spec.ts is a source file in the vue codebase, written in typescript.

What does functional.spec.ts depend on?

functional.spec.ts imports 2 module(s): vnode, vue.

Where is functional.spec.ts in the architecture?

functional.spec.ts is located at test/unit/features/options/functional.spec.ts (directory: test/unit/features/options).

Analyze Your Own Codebase

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

Try Supermodel Free