Created
November 25, 2024 23:11
-
-
Save dalechyn/d2329ed0b1e8f16eea81520ad38d3d82 to your computer and use it in GitHub Desktop.
patch to fix ssr issues within frame sdk
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| diff --git a/node_modules/@farcaster/frame-sdk/dist/endpoint.js b/node_modules/@farcaster/frame-sdk/dist/endpoint.js | |
| index b034ca0..697a451 100644 | |
| --- a/node_modules/@farcaster/frame-sdk/dist/endpoint.js | |
| +++ b/node_modules/@farcaster/frame-sdk/dist/endpoint.js | |
| @@ -1,18 +1,32 @@ | |
| var _a; | |
| import { windowEndpoint } from "comlink"; | |
| +const mockEndpoint = { | |
| + // noop | |
| + postMessage() { }, | |
| + // noop | |
| + addEventListener: () => { | |
| + }, | |
| + // noop | |
| + removeEventListener: () => { | |
| + }, | |
| +} | |
| const webViewEndpoint = { | |
| - postMessage: (data) => { | |
| - console.debug("[webview:req]", data); | |
| - window.ReactNativeWebView.postMessage(JSON.stringify(data)); | |
| - }, | |
| - addEventListener: (_, listener, ...args) => { | |
| - document.addEventListener("FarcasterFrameCallback", listener, ...args); | |
| - }, | |
| - removeEventListener: (_, listener) => { | |
| - document.removeEventListener("FarcasterFrameCallback", listener); | |
| - }, | |
| + postMessage: (data) => { | |
| + console.debug("[webview:req]", data); | |
| + window.ReactNativeWebView.postMessage(JSON.stringify(data)); | |
| + }, | |
| + addEventListener: (_, listener, ...args) => { | |
| + document.addEventListener("FarcasterFrameCallback", listener, ...args); | |
| + }, | |
| + removeEventListener: (_, listener) => { | |
| + document.removeEventListener("FarcasterFrameCallback", listener); | |
| + }, | |
| }; | |
| -export const endpoint = (window === null || window === void 0 ? void 0 : window.ReactNativeWebView) | |
| +export const endpoint = (() => { | |
| + if (typeof window === 'undefined') return mockEndpoint | |
| + return window?.ReactNativeWebView | |
| ? webViewEndpoint | |
| : // TODO fallback cleanly when not in iFrame or webview | |
| - windowEndpoint((_a = window === null || window === void 0 ? void 0 : window.parent) !== null && _a !== void 0 ? _a : window); | |
| + windowEndpoint(window?.parent ?? window); | |
| +})() | |
| + | |
| diff --git a/node_modules/@farcaster/frame-sdk/dist/provider.js b/node_modules/@farcaster/frame-sdk/dist/provider.js | |
| index 4191c14..e0bdf60 100644 | |
| --- a/node_modules/@farcaster/frame-sdk/dist/provider.js | |
| +++ b/node_modules/@farcaster/frame-sdk/dist/provider.js | |
| @@ -3,16 +3,17 @@ import { frameHost } from "./frameHost"; | |
| const emitter = Provider.createEmitter(); | |
| const store = RpcRequest.createStore(); | |
| export const provider = Provider.from({ | |
| - ...emitter, | |
| - async request(args) { | |
| - return await frameHost.ethProviderRequest( | |
| - // @ts-expect-error - from ox examples but our FetchFn needs better typing | |
| - store.prepare(args)); | |
| - }, | |
| + ...emitter, | |
| + async request(args) { | |
| + return await frameHost.ethProviderRequest( | |
| + // @ts-expect-error - from ox examples but our FetchFn needs better typing | |
| + store.prepare(args)); | |
| + }, | |
| }); | |
| -document.addEventListener("FarcasterFrameEvent", (event) => { | |
| +if (typeof document !== 'undefined') | |
| + document.addEventListener("FarcasterFrameEvent", (event) => { | |
| if (event instanceof MessageEvent) { | |
| - // TODO narrow to EventMap types and emit | |
| - // emitter.emit(event.type as (keyof Provider.EventMap), event.data); | |
| + // TODO narrow to EventMap types and emit | |
| + // emitter.emit(event.type as (keyof Provider.EventMap), event.data); | |
| } | |
| -}); | |
| + }); | |
| diff --git a/node_modules/@farcaster/frame-sdk/dist/sdk.js b/node_modules/@farcaster/frame-sdk/dist/sdk.js | |
| index ad3ef38..1bbd3d7 100644 | |
| --- a/node_modules/@farcaster/frame-sdk/dist/sdk.js | |
| +++ b/node_modules/@farcaster/frame-sdk/dist/sdk.js | |
| @@ -2,44 +2,45 @@ import { EventEmitter } from "eventemitter3"; | |
| import { frameHost } from "./frameHost"; | |
| import { provider } from "./provider"; | |
| export function createEmitter() { | |
| - const emitter = new EventEmitter(); | |
| - return { | |
| - get eventNames() { | |
| - return emitter.eventNames.bind(emitter); | |
| - }, | |
| - get listenerCount() { | |
| - return emitter.listenerCount.bind(emitter); | |
| - }, | |
| - get listeners() { | |
| - return emitter.listeners.bind(emitter); | |
| - }, | |
| - addListener: emitter.addListener.bind(emitter), | |
| - emit: emitter.emit.bind(emitter), | |
| - off: emitter.off.bind(emitter), | |
| - on: emitter.on.bind(emitter), | |
| - once: emitter.once.bind(emitter), | |
| - removeAllListeners: emitter.removeAllListeners.bind(emitter), | |
| - removeListener: emitter.removeListener.bind(emitter), | |
| - }; | |
| + const emitter = new EventEmitter(); | |
| + return { | |
| + get eventNames() { | |
| + return emitter.eventNames.bind(emitter); | |
| + }, | |
| + get listenerCount() { | |
| + return emitter.listenerCount.bind(emitter); | |
| + }, | |
| + get listeners() { | |
| + return emitter.listeners.bind(emitter); | |
| + }, | |
| + addListener: emitter.addListener.bind(emitter), | |
| + emit: emitter.emit.bind(emitter), | |
| + off: emitter.off.bind(emitter), | |
| + on: emitter.on.bind(emitter), | |
| + once: emitter.once.bind(emitter), | |
| + removeAllListeners: emitter.removeAllListeners.bind(emitter), | |
| + removeListener: emitter.removeListener.bind(emitter), | |
| + }; | |
| } | |
| const emitter = createEmitter(); | |
| export const sdk = { | |
| - ...emitter, | |
| - context: frameHost.context, | |
| - actions: { | |
| - setPrimaryButton: frameHost.setPrimaryButton.bind(frameHost), | |
| - ready: frameHost.ready.bind(frameHost), | |
| - close: frameHost.close.bind(frameHost), | |
| - openUrl: frameHost.openUrl.bind(frameHost), | |
| - }, | |
| - wallet: { | |
| - ethProvider: provider, | |
| - } | |
| + ...emitter, | |
| + context: frameHost.context, | |
| + actions: { | |
| + setPrimaryButton: frameHost.setPrimaryButton.bind(frameHost), | |
| + ready: frameHost.ready.bind(frameHost), | |
| + close: frameHost.close.bind(frameHost), | |
| + openUrl: frameHost.openUrl.bind(frameHost), | |
| + }, | |
| + wallet: { | |
| + ethProvider: provider, | |
| + } | |
| }; | |
| -document.addEventListener("FarcasterFrameEvent", (event) => { | |
| +if (typeof document !== 'undefined') | |
| + document.addEventListener("FarcasterFrameEvent", (event) => { | |
| if (event instanceof MessageEvent) { | |
| - if (event.data.type === "primaryButtonClicked") { | |
| - emitter.emit("primaryButtonClicked"); | |
| - } | |
| + if (event.data.type === "primaryButtonClicked") { | |
| + emitter.emit("primaryButtonClicked"); | |
| + } | |
| } | |
| -}); | |
| + }); | |
| diff --git a/node_modules/@farcaster/frame-sdk/src/endpoint.ts b/node_modules/@farcaster/frame-sdk/src/endpoint.ts | |
| index d7aac19..54ef4c5 100644 | |
| --- a/node_modules/@farcaster/frame-sdk/src/endpoint.ts | |
| +++ b/node_modules/@farcaster/frame-sdk/src/endpoint.ts | |
| @@ -1,5 +1,16 @@ | |
| import { type Endpoint, windowEndpoint } from "comlink"; | |
| +const mockEndpoint: Endpoint = { | |
| + // noop | |
| + postMessage() { }, | |
| + // noop | |
| + addEventListener: () => { | |
| + }, | |
| + // noop | |
| + removeEventListener: () => { | |
| + }, | |
| +} | |
| + | |
| const webViewEndpoint: Endpoint = { | |
| postMessage: (data: unknown) => { | |
| console.debug("[webview:req]", data); | |
| @@ -13,7 +24,11 @@ const webViewEndpoint: Endpoint = { | |
| }, | |
| }; | |
| -export const endpoint = window?.ReactNativeWebView | |
| - ? webViewEndpoint | |
| - : // TODO fallback cleanly when not in iFrame or webview | |
| +export const endpoint = (() => { | |
| + if (typeof window === 'undefined') return mockEndpoint | |
| + return window?.ReactNativeWebView | |
| + ? webViewEndpoint | |
| + : // TODO fallback cleanly when not in iFrame or webview | |
| windowEndpoint(window?.parent ?? window); | |
| +})() | |
| + | |
| diff --git a/node_modules/@farcaster/frame-sdk/src/provider.ts b/node_modules/@farcaster/frame-sdk/src/provider.ts | |
| index 843ed6a..f1754d3 100644 | |
| --- a/node_modules/@farcaster/frame-sdk/src/provider.ts | |
| +++ b/node_modules/@farcaster/frame-sdk/src/provider.ts | |
| @@ -16,9 +16,10 @@ export const provider = Provider.from({ | |
| export type ProviderType = typeof provider; | |
| -document.addEventListener("FarcasterFrameEvent", (event) => { | |
| - if (event instanceof MessageEvent) { | |
| - // TODO narrow to EventMap types and emit | |
| - // emitter.emit(event.type as (keyof Provider.EventMap), event.data); | |
| - } | |
| -}); | |
| +if (typeof document !== 'undefined') | |
| + document.addEventListener("FarcasterFrameEvent", (event) => { | |
| + if (event instanceof MessageEvent) { | |
| + // TODO narrow to EventMap types and emit | |
| + // emitter.emit(event.type as (keyof Provider.EventMap), event.data); | |
| + } | |
| + }); | |
| diff --git a/node_modules/@farcaster/frame-sdk/src/sdk.ts b/node_modules/@farcaster/frame-sdk/src/sdk.ts | |
| index ca87b18..60b70c0 100644 | |
| --- a/node_modules/@farcaster/frame-sdk/src/sdk.ts | |
| +++ b/node_modules/@farcaster/frame-sdk/src/sdk.ts | |
| @@ -42,10 +42,11 @@ export const sdk: FrameSDK = { | |
| } | |
| }; | |
| -document.addEventListener("FarcasterFrameEvent", (event) => { | |
| - if (event instanceof MessageEvent) { | |
| - if (event.data.type === "primaryButtonClicked") { | |
| - emitter.emit("primaryButtonClicked"); | |
| +if (typeof document !== 'undefined') | |
| + document.addEventListener("FarcasterFrameEvent", (event) => { | |
| + if (event instanceof MessageEvent) { | |
| + if (event.data.type === "primaryButtonClicked") { | |
| + emitter.emit("primaryButtonClicked"); | |
| + } | |
| } | |
| - } | |
| -}); | |
| + }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment