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.

Entity Profile

Dependency Diagram

graph LR
  bfd54ac4_6081_517d_5b4d_6502206e15c6["readonly.spec.ts"]
  6a13c450_be5a_326d_7e2d_c1d429be7e83["v3"]
  bfd54ac4_6081_517d_5b4d_6502206e15c6 --> 6a13c450_be5a_326d_7e2d_c1d429be7e83
  3a63aff0_8a8f_7988_aef0_ae98d03fcf43["effect"]
  bfd54ac4_6081_517d_5b4d_6502206e15c6 --> 3a63aff0_8a8f_7988_aef0_ae98d03fcf43
  cf1af910_0651_68a5_bdd0_87db5433e4bf["observer"]
  bfd54ac4_6081_517d_5b4d_6502206e15c6 --> cf1af910_0651_68a5_bdd0_87db5433e4bf
  style bfd54ac4_6081_517d_5b4d_6502206e15c6 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

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 CompilerSFC domain, ScriptAnalyzer 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: CompilerSFC, subdomain: ScriptAnalyzer, 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