Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove test references from main code #264

Merged
merged 1 commit into from
Dec 31, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 8 additions & 3 deletions spec/setup.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { JSDOM } from "jsdom"
import { afterEach, vi } from "vitest"
import { beforeEach, afterEach, vi } from "vitest"
import { clearNostoGlobals } from "@nosto/nosto-js/testing"

const { window } = new JSDOM("<html></html>", {
Expand All @@ -16,8 +16,13 @@ global.document = window.document
global.localStorage = window.localStorage
global.navigator = window.navigator

// test mode flag
global.window.nostoReactTest = true
beforeEach(() => {
window.nostoab = {
settings: {
site: "localhost"
}
}
})

afterEach(() => {
clearNostoGlobals()
Expand Down
24 changes: 7 additions & 17 deletions spec/useLoadClientScript.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,7 @@ import { renderHook } from "@testing-library/react"
import { useLoadClientScript } from "../src/hooks/useLoadClientScript"
import scriptLoader from "../src/hooks/scriptLoader"
import "@testing-library/jest-dom/vitest"
import { nostojs, getNostoWindow, isNostoLoaded } from "@nosto/nosto-js"
import { reloadNosto } from "@nosto/nosto-js/testing"
import { nostojs, isNostoLoaded, getNostoWindow } from "@nosto/nosto-js"

function loadClientScript(merchant: string) {
const script = document.createElement("script")
Expand All @@ -13,10 +12,7 @@ function loadClientScript(merchant: string) {
script.type = "text/javascript"
script.async = true
const promise = new Promise<void>(resolve => {
script.onload = () => {
reloadNosto({ site: "localhost" })
resolve()
}
script.onload = () => resolve()
})
document.body.appendChild(script)
return promise
Expand All @@ -26,6 +22,10 @@ function getScriptSources() {
return Array.from(document.querySelectorAll("script")).map(script => script.src)
}

function wait(time: number) {
return new Promise(resolve => setTimeout(resolve, time))
}

describe("useLoadClientScript", () => {
const testAccount = "shopify-11368366139"

Expand All @@ -34,6 +34,7 @@ describe("useLoadClientScript", () => {
await new Promise(nostojs)

hook.rerender()
await wait(1)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Were the assertations expected too fast after re-rerender?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes

expect(hook.result.current.clientScriptLoaded).toBe(true)
expect(isNostoLoaded()).toBeTruthy()
expect(getScriptSources()).toEqual([`https://connect.nosto.com/include/${testAccount}`])
Expand Down Expand Up @@ -71,17 +72,6 @@ describe("useLoadClientScript", () => {
expect(getScriptSources()).toEqual([`http://connect.nosto.com/include/${testAccount}`])
})

it("reloads client script once with loadScript=false", async () => {
await loadClientScript(testAccount)
const reloadSpy = vi.spyOn(getNostoWindow()!, "reload")

const hook = renderHook(() => useLoadClientScript({ loadScript: false, account: testAccount }))
expect(reloadSpy).toHaveBeenCalledTimes(1)

hook.rerender()
expect(reloadSpy).toHaveBeenCalledTimes(1)
})

it("remove existing Shopify markets related scripts before loading new ones", () => {
const props = { account: testAccount, shopifyMarkets: { marketId: "123", language: "en" } }
const hook = renderHook(props => useLoadClientScript(props), { initialProps: props })
Expand Down
13 changes: 4 additions & 9 deletions src/hooks/useLoadClientScript.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,11 @@ import { useState, useEffect } from "react"
import type { NostoProviderProps } from "../components/NostoProvider"
import scriptLoaderFn from "./scriptLoader"
import { init, initNostoStub, isNostoLoaded, nostojs } from "@nosto/nosto-js"
import { reloadNosto } from "@nosto/nosto-js/testing"

type NostoScriptProps = Pick<NostoProviderProps, "account" | "host" | "shopifyMarkets" | "loadScript" | "scriptLoader">

const defaultAttributes = { "nosto-client-script": "" }

export function useLoadClientScript(props: NostoScriptProps) {
const {
host = "connect.nosto.com",
Expand All @@ -18,19 +19,13 @@ export function useLoadClientScript(props: NostoScriptProps) {

useEffect(() => {
function scriptOnload() {
// Override for production scripts to work in unit tests
if ("nostoReactTest" in window) {
reloadNosto({
site: "localhost"
})
}
setClientScriptLoaded(true)
}

// Create and append script element
async function injectScriptElement(urlPartial: string, extraAttributes: Record<string, string> = {}) {
const scriptSrc = `//${host}${urlPartial}`
const attributes = { "nosto-client-script": "", ...extraAttributes }
const attributes = { ...defaultAttributes, ...extraAttributes }
await scriptLoader(scriptSrc, { attributes })
scriptOnload()
}
Expand Down Expand Up @@ -71,7 +66,7 @@ export function useLoadClientScript(props: NostoScriptProps) {
await init({
merchantId: account,
options: {
attributes: { "nosto-client-script": ""}
attributes: defaultAttributes
},
scriptLoader
})
Expand Down
Loading