Advanced Usage
Async Operations with Error Handling
Copy
class TradingAppManager {
private iframe: HTMLIFrameElement;
private isReady: boolean = false;
private timeout: number = 10000; // 10 seconds
constructor(iframeId: string) {
this.iframe = document.getElementById(iframeId) as HTMLIFrameElement;
this.setupMessageListener();
}
async addWallets(wallets: (string | Wallet)[]): Promise<boolean> {
return new Promise((resolve, reject) => {
if (!this.isReady) {
reject(new Error('Iframe not ready'));
return;
}
const timeout = setTimeout(() => {
reject(new Error('Timeout waiting for response'));
}, this.timeout);
const handleResponse = (event: MessageEvent<IframeResponse>) => {
if (event.source !== this.iframe.contentWindow) return;
if (event.data.type === 'WALLETS_ADDED') {
clearTimeout(timeout);
window.removeEventListener('message', handleResponse);
resolve(event.data.success);
}
};
window.addEventListener('message', handleResponse);
this.iframe.contentWindow?.postMessage({
type: 'ADD_WALLETS',
wallets
}, '*');
});
}
async getCurrentWallets(): Promise<WhitelistItem[]> {
return new Promise((resolve, reject) => {
if (!this.isReady) {
reject(new Error('Iframe not ready'));
return;
}
const timeout = setTimeout(() => {
reject(new Error('Timeout waiting for response'));
}, this.timeout);
const handleResponse = (event: MessageEvent<IframeResponse>) => {
if (event.source !== this.iframe.contentWindow) return;
if (event.data.type === 'CURRENT_WALLETS') {
clearTimeout(timeout);
window.removeEventListener('message', handleResponse);
resolve(event.data.wallets);
}
};
window.addEventListener('message', handleResponse);
this.iframe.contentWindow?.postMessage({
type: 'GET_WALLETS'
}, '*');
});
}
}
Error Handling
Copy
interface ErrorResponse {
type: 'ERROR';
message: string;
code?: string;
}
function handleMessage(data: IframeResponse | ErrorResponse): void {
if (data.type === 'ERROR') {
console.error('Iframe error:', data.message);
return;
}
switch (data.type) {
case 'IFRAME_READY':
console.log('Iframe ready for communication');
break;
// ... other cases
}
}
Debug Mode
Copy
const DEBUG = true;
function debugLog(message: string, data?: any): void {
if (DEBUG) {
console.log(`[TradingIframe] ${message}`, data);
}
}
