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

     1  import { render, screen } from "@testing-library/react"
     2  import userEvent from "@testing-library/user-event"
     3  import FileSaver from "file-saver"
     4  import moment from "moment"
     5  import React from "react"
     6  import ReactDOM from "react-dom"
     7  import ReactModal from "react-modal"
     8  import ShareSnapshotModal from "./ShareSnapshotModal"
     9  import { nResourceView } from "./testdata"
    10  
    11  const FAKE_SNAPSHOT: Proto.webviewSnapshot = { view: nResourceView(1) }
    12  const fakeSendsnapshot = () => {}
    13  const fakeHandleCloseModal = () => {}
    14  const fakeGetSnapshot = () => FAKE_SNAPSHOT
    15  let originalCreatePortal = ReactDOM.createPortal
    16  
    17  describe("ShareSnapshotModal", () => {
    18    beforeEach(() => {
    19      // Note: `body` is used as the app element _only_ in a test env
    20      // since the app root element isn't available; in prod, it should
    21      // be set as the app root so that accessibility features are set correctly
    22      ReactModal.setAppElement(document.body)
    23      let mock: any = (node: any) => node
    24      ReactDOM.createPortal = mock
    25    })
    26  
    27    afterEach(() => {
    28      ReactDOM.createPortal = originalCreatePortal
    29    })
    30  
    31    describe("LocalSnapshotDialog", () => {
    32      let getSnapshotSpy: jest.Mock
    33      beforeEach(() => {
    34        Date.now = jest.fn(() => 1652119615751)
    35        getSnapshotSpy = jest.fn(() => FAKE_SNAPSHOT)
    36        jest.mock("file-saver")
    37  
    38        render(
    39          <ShareSnapshotModal
    40            handleClose={fakeHandleCloseModal}
    41            getSnapshot={getSnapshotSpy}
    42            isOpen={true}
    43            dialogAnchor={document.body}
    44          />
    45        )
    46      })
    47  
    48      afterEach(() => {
    49        jest.unmock("file-saver")
    50        jest.useRealTimers()
    51      })
    52  
    53      it("gets the snapshot data on download", () => {
    54        userEvent.click(screen.getByText("Save Snapshot"))
    55  
    56        expect(getSnapshotSpy).toHaveBeenCalled()
    57      })
    58  
    59      it("saves the snapshot data with correct filename on download", async () => {
    60        userEvent.click(screen.getByText("Save Snapshot"))
    61  
    62        expect(FileSaver.saveAs).toHaveBeenCalledTimes(1)
    63  
    64        const spyCalls = (FileSaver.saveAs as unknown as jest.Mock).mock.calls
    65        const blob = spyCalls[0][0] as Blob
    66        const filename = spyCalls[0][1] as string
    67  
    68        // TODO (lizz): Add this case back in. Right now, parsing the blob
    69        // causes an ECONNREFUSED error, even though the test passes.
    70        // const blobText = await blob.text()
    71        // expect(blobText).toEqual(JSON.stringify(FAKE_SNAPSHOT))
    72  
    73        const testTimestamp = moment().format("YYYY-MM-DD_HHmmss")
    74        expect(filename).toEqual(`tilt-snapshot_${testTimestamp}.json`)
    75      }, 120000)
    76    })
    77  })