github.com/tilt-dev/tilt@v0.33.15-0.20240515162809-0a22ed45d8a0/web/src/BrowerStorage.test.tsx (about)

     1  import { render, screen } from "@testing-library/react"
     2  import React from "react"
     3  import {
     4    makeKey,
     5    tiltfileKeyContext,
     6    usePersistentState,
     7  } from "./BrowserStorage"
     8  
     9  describe("localStorageContext", () => {
    10    afterEach(() => {
    11      localStorage.clear()
    12    })
    13  
    14    it("stores data to local storage", () => {
    15      function ValueSetter() {
    16        const [value, setValue] = usePersistentState<string>(
    17          "test-key",
    18          "initial"
    19        )
    20        if (value !== "test-write-value") {
    21          setValue("test-write-value")
    22        }
    23        return null
    24      }
    25  
    26      render(
    27        <tiltfileKeyContext.Provider value={"test"}>
    28          <ValueSetter />
    29        </tiltfileKeyContext.Provider>
    30      )
    31  
    32      expect(localStorage.getItem(makeKey("test", "test-key"))).toEqual(
    33        JSON.stringify("test-write-value")
    34      )
    35    })
    36  
    37    it("reads data from local storage", () => {
    38      localStorage.setItem(
    39        makeKey("test", "test-key"),
    40        JSON.stringify("test-read-value")
    41      )
    42  
    43      function ValueGetter() {
    44        const [value, _setValue] = usePersistentState<string>(
    45          "test-key",
    46          "initial"
    47        )
    48        return <p aria-label="saved value">{value}</p>
    49      }
    50      render(
    51        <tiltfileKeyContext.Provider value="test">
    52          <ValueGetter />
    53        </tiltfileKeyContext.Provider>
    54      )
    55  
    56      expect(screen.getByLabelText("saved value")).toHaveTextContent(
    57        "test-read-value"
    58      )
    59    })
    60  })