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

readonly.spec.ts — vue Source File

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

File typescript VueCore VDom 3 imports 1 classes

Entity Profile

Dependency Diagram

graph LR
  1aa6c1be_f0b9_41b7_97a0_6144e47eb3f6["readonly.spec.ts"]
  d970b406_3424_b00e_55dd_82e98ab5aac2["v3"]
  1aa6c1be_f0b9_41b7_97a0_6144e47eb3f6 --> d970b406_3424_b00e_55dd_82e98ab5aac2
  1a5e86bd_1a43_1523_b480_a1b1a98c87ad["effect"]
  1aa6c1be_f0b9_41b7_97a0_6144e47eb3f6 --> 1a5e86bd_1a43_1523_b480_a1b1a98c87ad
  eb7174f6_f021_7b84_3862_bd9a0db1b30a["observer"]
  1aa6c1be_f0b9_41b7_97a0_6144e47eb3f6 --> eb7174f6_f021_7b84_3862_bd9a0db1b30a
  style 1aa6c1be_f0b9_41b7_97a0_6144e47eb3f6 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import {
  reactive,
  readonly,
  toRaw,
  isReactive,
  isReadonly,
  markRaw,
  ref,
  isProxy
} from 'v3'
import { effect } from 'v3/reactivity/effect'
import { set, del } from 'core/observer'

/**
 * @see https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-4.html
 */
type Writable<T> = { -readonly [P in keyof T]: T[P] }

describe('reactivity/readonly', () => {
  describe('Object', () => {
    it('should make nested values readonly', () => {
      const original = { foo: 1, bar: { baz: 2 } }
      const wrapped = readonly(original)
      expect(wrapped).not.toBe(original)
      expect(isProxy(wrapped)).toBe(true)
      expect(isReactive(wrapped)).toBe(false)
      expect(isReadonly(wrapped)).toBe(true)
      expect(isReactive(original)).toBe(false)
      expect(isReadonly(original)).toBe(false)
      expect(isReactive(wrapped.bar)).toBe(false)
      expect(isReadonly(wrapped.bar)).toBe(true)
      expect(isReactive(original.bar)).toBe(false)
      expect(isReadonly(original.bar)).toBe(false)
      // get
      expect(wrapped.foo).toBe(1)
      // has
      expect('foo' in wrapped).toBe(true)
      // ownKeys
      expect(Object.keys(wrapped)).toEqual(['foo', 'bar'])
    })

    it('should not allow mutation', () => {
      const qux = Symbol('qux')
      const original = {
        foo: 1,
        bar: {
          baz: 2
        },
        [qux]: 3
      }
      const wrapped: Writable<typeof original> = readonly(original)

      wrapped.foo = 2
      expect(wrapped.foo).toBe(1)
      expect(
        `Set operation on key "foo" failed: target is readonly.`
      ).toHaveBeenWarnedLast()

      set(wrapped.bar, `baz`, 3)
      expect(wrapped.bar.baz).toBe(2)
// ... (479 more lines)

Domain

Subdomains

Classes

Types

Dependencies

  • effect
  • observer
  • v3

Source

Frequently Asked Questions

What does readonly.spec.ts do?
readonly.spec.ts is a source file in the vue codebase, written in typescript. It belongs to the VueCore domain, VDom subdomain.
What does readonly.spec.ts depend on?
readonly.spec.ts imports 3 module(s): effect, observer, v3.
Where is readonly.spec.ts in the architecture?
readonly.spec.ts is located at test/unit/features/v3/reactivity/readonly.spec.ts (domain: VueCore, subdomain: VDom, 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