computed.spec.ts — vue Source File

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

File typescript 4 imports

Entity Profile

Dependency Diagram

graph LR
  ae3898e1_d2dd_633e_0f40_13bc5bd03764["computed.spec.ts"]
  6a13c450_be5a_326d_7e2d_c1d429be7e83["v3"]
  ae3898e1_d2dd_633e_0f40_13bc5bd03764 --> 6a13c450_be5a_326d_7e2d_c1d429be7e83
  3a63aff0_8a8f_7988_aef0_ae98d03fcf43["effect"]
  ae3898e1_d2dd_633e_0f40_13bc5bd03764 --> 3a63aff0_8a8f_7988_aef0_ae98d03fcf43
  8a5fb776_a8f4_ce8a_8549_67af07f2e1e9["util"]
  ae3898e1_d2dd_633e_0f40_13bc5bd03764 --> 8a5fb776_a8f4_ce8a_8549_67af07f2e1e9
  44839739_d7ca_1c00_8a38_885896b69e14["index"]
  ae3898e1_d2dd_633e_0f40_13bc5bd03764 --> 44839739_d7ca_1c00_8a38_885896b69e14
  style ae3898e1_d2dd_633e_0f40_13bc5bd03764 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import {
  computed,
  reactive,
  ref,
  isReadonly,
  WritableComputedRef,
  DebuggerEvent,
  TrackOpTypes,
  TriggerOpTypes
} from 'v3'
import { effect } from 'v3/reactivity/effect'
import { nextTick } from 'core/util'
import { set, del } from 'core/observer/index'

describe('reactivity/computed', () => {
  it('should return updated value', () => {
    const value = reactive({ foo: 1 })
    const cValue = computed(() => value.foo)
    expect(cValue.value).toBe(1)
    value.foo = 2
    expect(cValue.value).toBe(2)
  })

  it('should compute lazily', () => {
    const value = reactive<{ foo?: number }>({ foo: undefined })
    const getter = vi.fn(() => value.foo)
    const cValue = computed(getter)

    // lazy
    expect(getter).not.toHaveBeenCalled()

    expect(cValue.value).toBe(undefined)
    expect(getter).toHaveBeenCalledTimes(1)

    // should not compute again
    cValue.value
    expect(getter).toHaveBeenCalledTimes(1)

    // should not compute until needed
    value.foo = 1
    expect(getter).toHaveBeenCalledTimes(1)

    // now it should compute
    expect(cValue.value).toBe(1)
    expect(getter).toHaveBeenCalledTimes(2)

    // should not compute again
    cValue.value
    expect(getter).toHaveBeenCalledTimes(2)
  })

  it('should trigger effect', () => {
    const value = reactive<{ foo?: number }>({ foo: undefined })
    const cValue = computed(() => value.foo)
    let dummy
    effect(() => {
      dummy = cValue.value
    })
    expect(dummy).toBe(undefined)
    value.foo = 1
// ... (242 more lines)

Dependencies

effect
index
util
v3

Source

View on GitHub

Frequently Asked Questions

What does computed.spec.ts do?

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

What does computed.spec.ts depend on?

computed.spec.ts imports 4 module(s): effect, index, util, v3.

Where is computed.spec.ts in the architecture?

computed.spec.ts is located at test/unit/features/v3/reactivity/computed.spec.ts (directory: test/unit/features/v3/reactivity).

Analyze Your Own Codebase

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

Try Supermodel Free