releasebird-javascript-sdk 1.0.65 → 1.0.66

package/src/RbirdScreenshotManager.js

@@ -92,6 +92,19 @@ export default class RbirdScreenshotManager {
         let that = this;
         const loader = this.showLoader();
 
+        // Global timeout for entire screenshot process (45 seconds)
+        const SCREENSHOT_TIMEOUT = 45000;
+        let screenshotCompleted = false;
+
+        const timeoutId = setTimeout(() => {
+            if (!screenshotCompleted) {
+                console.error('[Screenshot] Timeout - screenshot took too long');
+                that.hideLoader();
+                that.deactivateMarker();
+                alert('Screenshot took too long to generate. Please try again with a simpler page or contact support.');
+            }
+        }, SCREENSHOT_TIMEOUT);
+
         // Wait a moment for the loader to render, then hide our UI elements
         setTimeout(() => {
             console.log('[Screenshot] Starting HTML export method...');
@@ -124,6 +137,8 @@ export default class RbirdScreenshotManager {
                     that.renderScreenshotOnBackend(htmlData)
                         .then((screenshotDataUrl) => {
                             console.log('[Screenshot] Screenshot received from backend!');
+                            screenshotCompleted = true;
+                            clearTimeout(timeoutId);
 
                             // Restore visibility
                             loader.style.visibility = 'visible';
@@ -148,6 +163,8 @@ export default class RbirdScreenshotManager {
                         })
                         .catch((error) => {
                             console.error('[Screenshot] Backend rendering failed:', error);
+                            screenshotCompleted = true;
+                            clearTimeout(timeoutId);
 
                             // Restore visibility
                             loader.style.visibility = 'visible';
@@ -159,10 +176,13 @@ export default class RbirdScreenshotManager {
                             }
 
                             that.hideLoader();
+                            that.deactivateMarker();
                             alert('Screenshot could not be created. Please try again or contact support.');
                         });
                 } catch (error) {
                     console.error('[Screenshot] HTML export failed:', error);
+                    screenshotCompleted = true;
+                    clearTimeout(timeoutId);
 
                     // Restore visibility
                     loader.style.visibility = 'visible';
@@ -174,6 +194,7 @@ export default class RbirdScreenshotManager {
                     }
 
                     that.hideLoader();
+                    that.deactivateMarker();
                     alert('Screenshot could not be created. Please try again or contact support.');
                 }
             });
@@ -553,14 +574,26 @@ export default class RbirdScreenshotManager {
 
                 const widgetInstance = this.getRbirdWebsiteWidget().getInstance();
 
+                // Create abort controller for timeout
+                const controller1 = new AbortController();
+                const timeout1 = setTimeout(() => controller1.abort(), 10000); // 10s timeout
+
                 // 1. Get presigned URL
                 const urlResponse = await fetch(`${API}/images/screenshot/upload-url`, {
                     method: 'POST',
                     headers: {
                         'Content-Type': 'application/json',
                         'apiKey': widgetInstance.apiKey || ''
+                    },
+                    signal: controller1.signal
+                }).catch(err => {
+                    clearTimeout(timeout1);
+                    if (err.name === 'AbortError') {
+                        throw new Error('Timeout getting upload URL');
                     }
+                    throw err;
                 });
+                clearTimeout(timeout1);
 
                 if (!urlResponse.ok) {
                     throw new Error(`Failed to get upload URL: ${urlResponse.status}`);
@@ -570,13 +603,24 @@ export default class RbirdScreenshotManager {
                 console.log(`[Screenshot] Step 2: Uploading HTML to S3 (key: ${key})...`);
 
                 // 2. Upload HTML directly to S3
+                const controller2 = new AbortController();
+                const timeout2 = setTimeout(() => controller2.abort(), 15000); // 15s timeout
+
                 const s3Response = await fetch(uploadUrl, {
                     method: 'PUT',
                     body: html,
                     headers: {
                         'Content-Type': 'text/html'
+                    },
+                    signal: controller2.signal
+                }).catch(err => {
+                    clearTimeout(timeout2);
+                    if (err.name === 'AbortError') {
+                        throw new Error('Timeout uploading to S3');
                     }
+                    throw err;
                 });
+                clearTimeout(timeout2);
 
                 if (!s3Response.ok) {
                     throw new Error(`Failed to upload to S3: ${s3Response.status}`);
@@ -585,6 +629,9 @@ export default class RbirdScreenshotManager {
                 console.log('[Screenshot] Step 3: Requesting screenshot render from backend...');
 
                 // 3. Request screenshot render via backend
+                const controller3 = new AbortController();
+                const timeout3 = setTimeout(() => controller3.abort(), 20000); // 20s timeout
+
                 const renderResponse = await fetch(`${API}/images/screenshot/render`, {
                     method: 'POST',
                     headers: {
@@ -596,8 +643,16 @@ export default class RbirdScreenshotManager {
                         width: window.innerWidth,
                         height: window.innerHeight,
                         url: window.location.href
-                    })
+                    }),
+                    signal: controller3.signal
+                }).catch(err => {
+                    clearTimeout(timeout3);
+                    if (err.name === 'AbortError') {
+                        throw new Error('Timeout rendering screenshot');
+                    }
+                    throw err;
                 });
+                clearTimeout(timeout3);
 
                 if (!renderResponse.ok) {
                     const errorText = await renderResponse.text();
@@ -627,6 +682,13 @@ export default class RbirdScreenshotManager {
             http.open('POST', `${API}/images/screenshot/render`);
             http.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');
 
+            // Add timeout for XHR request (20 seconds)
+            http.timeout = 20000;
+            http.ontimeout = function() {
+                console.error('[Screenshot] Request timeout');
+                reject(new Error('Screenshot render timeout'));
+            };
+
             // Add API key if available
             const widgetInstance = this.getRbirdWebsiteWidget().getInstance();
             if (widgetInstance.apiKey) {

package/src/RbirdWebsiteWidget.js

@@ -49,7 +49,7 @@ export default class RbirdWebsiteWidget {
 
     isMobileDevice = () =>  {
         if (typeof window === 'undefined') return false;
-        const mobileMaxWidth = 768; // Definiert die maximale Breite für mobile Geräte, z.B. Tablets und Smartphones
+        const mobileMaxWidth = 768;
         return window.innerWidth <= mobileMaxWidth;
     }
 
@@ -60,16 +60,14 @@ export default class RbirdWebsiteWidget {
                 return;
             }
 
-            // Überprüfen, ob das Widget bereits sichtbar ist
             if (this.websiteWidgetVisible) {
-                resolve();  // Wenn das Widget bereits sichtbar ist, wird das Promise sofort aufgelöst
+                resolve();
                 return;
             }
 
             this.websiteWidgetVisible = true;
 
             try {
-                // Widget-Element erstellen und zum DOM hinzufügen
                 let elem = document.createElement("div");
                 elem.onclick = () => {
                     this.openWebsiteWidget();
@@ -77,7 +75,6 @@ export default class RbirdWebsiteWidget {
                 document.body.appendChild(elem);
                 this.websiteWidget = elem;
 
-                // Überprüfen, ob das Schließen des Widgets erlaubt ist
                 if (RbirdSessionManager.getInstance().widgetSettings?.allowClose && !this.noButton) {
                     this.hideWidgetButton = document.createElement("div");
                     this.hideWidgetButton.className = "hideWidgetButton";
@@ -87,19 +84,15 @@ export default class RbirdWebsiteWidget {
                     document.body.appendChild(this.hideWidgetButton);
                 }
 
-                // Badge erstellen und zum DOM hinzufügen
                 this.countBadge = document.createElement("span");
                 this.countBadge.className = "rbird_badge";
                 this.countBadge.style.display = "none";
                 document.body.appendChild(this.countBadge);
 
-                // Stil des Widgets anpassen
                 this.styleWidget();
 
-                // Erfolgreich aufgelöst, nachdem das Widget hinzugefügt und gestylt wurde
                 resolve();
             } catch (error) {
-                // Falls ein Fehler während der Widget-Erstellung oder des DOM-Manipulationsprozesses auftritt, wird das Promise abgelehnt
                 reject(new Error("Error rendering the website widget: " + error.message));
             }
         });