@adstage/web-sdk 2.5.0 → 2.5.2

package/dist/index.cjs.js

@@ -499,7 +499,7 @@ class ApiHeaders {
  * AdStage SDK - 버전 정보 유틸리티
  */
 // package.json에서 버전 정보 가져오기 (빌드 시 자동으로 교체됨)
-const SDK_VERSION$1 = '"2.5.0"';
+const SDK_VERSION$1 = '"2.5.2"';
 /**
  * SDK 버전 정보 반환
  */
@@ -1370,10 +1370,9 @@ class CarouselSliderManager {
                     }
                 });
             }
-            // 현재 슬라이드의 광고에 대해 노출 이벤트 추적
-            if (actualIndex > 0) { // 첫 번째는 이미 loadSlot에서 추적됨
-                trackEventCallback(advertisements[actualIndex]._id, slot.id, AdEventType.VIEWABLE);
-            }
+            // 현재 슬라이드의 광고에 대해 노출 이벤트 추적 (모든 슬라이드 포함)
+            console.log(`🎯 Triggering VIEWABLE event for slide change: ad ${advertisements[actualIndex]._id} (index: ${actualIndex}) in slot: ${slot.id}`);
+            trackEventCallback(advertisements[actualIndex]._id, slot.id, AdEventType.VIEWABLE);
         };
         // 무한 루프 처리 함수
         const handleInfiniteLoop = () => {
@@ -1415,8 +1414,13 @@ class CarouselSliderManager {
         if (dotContainer) {
             sliderWrapper.appendChild(dotContainer);
         }
-        // 첫 번째 도트 활성화
+        // 첫 번째 도트 활성화 및 초기 VIEWABLE 이벤트 발생
         moveToSlide(0);
+        // 슬라이더 DOM 추가 후 첫 번째 광고 VIEWABLE 이벤트 트리거 (100ms 후 실제 노출 확인)
+        setTimeout(() => {
+            console.log(`🎯 Triggering initial VIEWABLE event for first ad: ${advertisements[0]._id} in slot: ${slot.id}`);
+            trackEventCallback(advertisements[0]._id, slot.id, AdEventType.VIEWABLE);
+        }, 100);
         // 사용자가 크기를 지정하지 않은 경우, 첫 번째 슬라이드 크기에 맞춰 래퍼 크기 동적 조정
         if (!slot.width || slot.width === 0) {
             // DOM 렌더링 후 크기 측정
@@ -2599,11 +2603,9 @@ class AdsModule {
             // 광고가 여러 개이거나 autoSlide 옵션이 있으면 슬라이더로 렌더링
             if (adstageData.length > 1 || slot.config?.autoSlide) {
                 await this.adRenderer?.renderAdSlider(slot, adstageData);
-                // 🔧 슬라이더의 첫 번째 광고도 자동 노출 추적 시작
-                if (adstageData.length > 0) {
-                    setTimeout(() => {
-                        this.startSimpleViewabilityTracking(slot, adstageData[0]);
-                    }, 100); // 슬라이더 렌더링 완료 후 추적 시작
+                // 🔧 슬라이더는 CarouselSliderManager에서 자체적으로 모든 광고의 VIEWABLE 이벤트를 처리
+                if (this._config?.debug) {
+                    console.log(`🎠 Slider will handle VIEWABLE events for ${adstageData.length} ads automatically`);
                 }
             }
             else {

package/dist/index.esm.js

@@ -497,7 +497,7 @@ class ApiHeaders {
  * AdStage SDK - 버전 정보 유틸리티
  */
 // package.json에서 버전 정보 가져오기 (빌드 시 자동으로 교체됨)
-const SDK_VERSION$1 = '"2.5.0"';
+const SDK_VERSION$1 = '"2.5.2"';
 /**
  * SDK 버전 정보 반환
  */
@@ -1368,10 +1368,9 @@ class CarouselSliderManager {
                     }
                 });
             }
-            // 현재 슬라이드의 광고에 대해 노출 이벤트 추적
-            if (actualIndex > 0) { // 첫 번째는 이미 loadSlot에서 추적됨
-                trackEventCallback(advertisements[actualIndex]._id, slot.id, AdEventType.VIEWABLE);
-            }
+            // 현재 슬라이드의 광고에 대해 노출 이벤트 추적 (모든 슬라이드 포함)
+            console.log(`🎯 Triggering VIEWABLE event for slide change: ad ${advertisements[actualIndex]._id} (index: ${actualIndex}) in slot: ${slot.id}`);
+            trackEventCallback(advertisements[actualIndex]._id, slot.id, AdEventType.VIEWABLE);
         };
         // 무한 루프 처리 함수
         const handleInfiniteLoop = () => {
@@ -1413,8 +1412,13 @@ class CarouselSliderManager {
         if (dotContainer) {
             sliderWrapper.appendChild(dotContainer);
         }
-        // 첫 번째 도트 활성화
+        // 첫 번째 도트 활성화 및 초기 VIEWABLE 이벤트 발생
         moveToSlide(0);
+        // 슬라이더 DOM 추가 후 첫 번째 광고 VIEWABLE 이벤트 트리거 (100ms 후 실제 노출 확인)
+        setTimeout(() => {
+            console.log(`🎯 Triggering initial VIEWABLE event for first ad: ${advertisements[0]._id} in slot: ${slot.id}`);
+            trackEventCallback(advertisements[0]._id, slot.id, AdEventType.VIEWABLE);
+        }, 100);
         // 사용자가 크기를 지정하지 않은 경우, 첫 번째 슬라이드 크기에 맞춰 래퍼 크기 동적 조정
         if (!slot.width || slot.width === 0) {
             // DOM 렌더링 후 크기 측정
@@ -2597,11 +2601,9 @@ class AdsModule {
             // 광고가 여러 개이거나 autoSlide 옵션이 있으면 슬라이더로 렌더링
             if (adstageData.length > 1 || slot.config?.autoSlide) {
                 await this.adRenderer?.renderAdSlider(slot, adstageData);
-                // 🔧 슬라이더의 첫 번째 광고도 자동 노출 추적 시작
-                if (adstageData.length > 0) {
-                    setTimeout(() => {
-                        this.startSimpleViewabilityTracking(slot, adstageData[0]);
-                    }, 100); // 슬라이더 렌더링 완료 후 추적 시작
+                // 🔧 슬라이더는 CarouselSliderManager에서 자체적으로 모든 광고의 VIEWABLE 이벤트를 처리
+                if (this._config?.debug) {
+                    console.log(`🎠 Slider will handle VIEWABLE events for ${adstageData.length} ads automatically`);
                 }
             }
             else {

package/dist/index.standalone.js

@@ -494,7 +494,7 @@ class ApiHeaders {
  * AdStage SDK - 버전 정보 유틸리티
  */
 // package.json에서 버전 정보 가져오기 (빌드 시 자동으로 교체됨)
-const SDK_VERSION$1 = '"2.5.0"';
+const SDK_VERSION$1 = '"2.5.2"';
 /**
  * SDK 버전 정보 반환
  */
@@ -1365,10 +1365,9 @@ class CarouselSliderManager {
                     }
                 });
             }
-            // 현재 슬라이드의 광고에 대해 노출 이벤트 추적
-            if (actualIndex > 0) { // 첫 번째는 이미 loadSlot에서 추적됨
-                trackEventCallback(advertisements[actualIndex]._id, slot.id, AdEventType.VIEWABLE);
-            }
+            // 현재 슬라이드의 광고에 대해 노출 이벤트 추적 (모든 슬라이드 포함)
+            console.log(`🎯 Triggering VIEWABLE event for slide change: ad ${advertisements[actualIndex]._id} (index: ${actualIndex}) in slot: ${slot.id}`);
+            trackEventCallback(advertisements[actualIndex]._id, slot.id, AdEventType.VIEWABLE);
         };
         // 무한 루프 처리 함수
         const handleInfiniteLoop = () => {
@@ -1410,8 +1409,13 @@ class CarouselSliderManager {
         if (dotContainer) {
             sliderWrapper.appendChild(dotContainer);
         }
-        // 첫 번째 도트 활성화
+        // 첫 번째 도트 활성화 및 초기 VIEWABLE 이벤트 발생
         moveToSlide(0);
+        // 슬라이더 DOM 추가 후 첫 번째 광고 VIEWABLE 이벤트 트리거 (100ms 후 실제 노출 확인)
+        setTimeout(() => {
+            console.log(`🎯 Triggering initial VIEWABLE event for first ad: ${advertisements[0]._id} in slot: ${slot.id}`);
+            trackEventCallback(advertisements[0]._id, slot.id, AdEventType.VIEWABLE);
+        }, 100);
         // 사용자가 크기를 지정하지 않은 경우, 첫 번째 슬라이드 크기에 맞춰 래퍼 크기 동적 조정
         if (!slot.width || slot.width === 0) {
             // DOM 렌더링 후 크기 측정
@@ -2594,11 +2598,9 @@ class AdsModule {
             // 광고가 여러 개이거나 autoSlide 옵션이 있으면 슬라이더로 렌더링
             if (adstageData.length > 1 || slot.config?.autoSlide) {
                 await this.adRenderer?.renderAdSlider(slot, adstageData);
-                // 🔧 슬라이더의 첫 번째 광고도 자동 노출 추적 시작
-                if (adstageData.length > 0) {
-                    setTimeout(() => {
-                        this.startSimpleViewabilityTracking(slot, adstageData[0]);
-                    }, 100); // 슬라이더 렌더링 완료 후 추적 시작
+                // 🔧 슬라이더는 CarouselSliderManager에서 자체적으로 모든 광고의 VIEWABLE 이벤트를 처리
+                if (this._config?.debug) {
+                    console.log(`🎠 Slider will handle VIEWABLE events for ${adstageData.length} ads automatically`);
                 }
             }
             else {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adstage/web-sdk",
-  "version": "2.5.0",
+  "version": "2.5.2",
   "description": "AdStage Web SDK - Production-ready marketing platform SDK with React Provider support for seamless integration",
   "type": "module",
   "main": "dist/index.cjs.js",

package/src/dummy/ads_dummy.json

@@ -0,0 +1,84 @@
+[
+    {
+        "_id": "68870e36bdfa1e6e54d108a5",
+        "title": "stageUp 입점 신청 - 수수료 할인 광고",
+        "description": "",
+        "adType": "BANNER",
+        "orgId": "c1cd5bb0-2f45-4e49-8e86-7ba653d3477c",
+        "textContent": "",
+        "imageUrl": "https://cmvn255e11092.edge.naverncp.com/d82ceba0-ce99-48e0-9a19-6a6c8792af31.png",
+        "videoUrl": "",
+        "linkUrl": "/partnership",
+        "startDate": "2025-07-28T00:00:00.000Z",
+        "endDate": "2025-12-31T00:00:00.000Z",
+        "status": "ACTIVE",
+        "order": 0,
+        "language": "ko",
+        "countries": [
+            "KR",
+            "US",
+            "JP",
+            "CN",
+            "DE",
+            "FR",
+            "GB",
+            "IT",
+            "ES",
+            "RU",
+            "ID",
+            "VN",
+            "TH",
+            "MY",
+            "SG",
+            "PH",
+            "IN",
+            "BR",
+            "CA",
+            "AU"
+        ],
+        "deviceType": "DESKTOP",
+        "createdAt": "2025-07-28T05:44:22.999Z",
+        "updatedAt": "2025-07-28T05:45:12.589Z"
+    },
+    {
+        "_id": "68870edbbdfa1e6e54d10901",
+        "title": "Join stageUp Today! - 간편한 통합 절차",
+        "description": "",
+        "adType": "BANNER",
+        "orgId": "c1cd5bb0-2f45-4e49-8e86-7ba653d3477c",
+        "textContent": "",
+        "imageUrl": "https://cmvn255e11092.edge.naverncp.com/550849fd-9c25-4e15-bd0f-a3efd7cff617.webp",
+        "videoUrl": "",
+        "linkUrl": "https://www.stageup.store/",
+        "startDate": "2025-07-28T00:00:00.000Z",
+        "endDate": "2025-12-31T00:00:00.000Z",
+        "status": "ACTIVE",
+        "order": 1,
+        "language": "ko",
+        "countries": [
+            "KR",
+            "US",
+            "JP",
+            "CN",
+            "DE",
+            "FR",
+            "GB",
+            "IT",
+            "ES",
+            "RU",
+            "ID",
+            "VN",
+            "TH",
+            "MY",
+            "SG",
+            "PH",
+            "IN",
+            "BR",
+            "CA",
+            "AU"
+        ],
+        "deviceType": "DESKTOP",
+        "createdAt": "2025-07-28T05:47:07.685Z",
+        "updatedAt": "2025-07-28T05:47:07.685Z"
+    }
+]

package/src/managers/ads/carousel-slider-manager.ts

@@ -217,10 +217,9 @@ export class CarouselSliderManager {
         });
       }
 
-      // 현재 슬라이드의 광고에 대해 노출 이벤트 추적
-      if (actualIndex > 0) { // 첫 번째는 이미 loadSlot에서 추적됨
-        trackEventCallback(advertisements[actualIndex]._id, slot.id, AdEventType.VIEWABLE);
-      }
+      // 현재 슬라이드의 광고에 대해 노출 이벤트 추적 (모든 슬라이드 포함)
+      console.log(`🎯 Triggering VIEWABLE event for slide change: ad ${advertisements[actualIndex]._id} (index: ${actualIndex}) in slot: ${slot.id}`);
+      trackEventCallback(advertisements[actualIndex]._id, slot.id, AdEventType.VIEWABLE);
     };
 
     // 무한 루프 처리 함수
@@ -270,8 +269,14 @@ export class CarouselSliderManager {
       sliderWrapper.appendChild(dotContainer);
     }
 
-    // 첫 번째 도트 활성화
+    // 첫 번째 도트 활성화 및 초기 VIEWABLE 이벤트 발생
     moveToSlide(0);
+    
+    // 슬라이더 DOM 추가 후 첫 번째 광고 VIEWABLE 이벤트 트리거 (100ms 후 실제 노출 확인)
+    setTimeout(() => {
+      console.log(`🎯 Triggering initial VIEWABLE event for first ad: ${advertisements[0]._id} in slot: ${slot.id}`);
+      trackEventCallback(advertisements[0]._id, slot.id, AdEventType.VIEWABLE);
+    }, 100);
 
     // 사용자가 크기를 지정하지 않은 경우, 첫 번째 슬라이드 크기에 맞춰 래퍼 크기 동적 조정
     if (!slot.width || slot.width === 0) {

package/src/modules/ads/AdsModule.ts

@@ -298,11 +298,9 @@ export class AdsModule implements BaseModule {
       if (adstageData.length > 1 || (slot.config as any)?.autoSlide) {
         await this.adRenderer?.renderAdSlider(slot, adstageData);
         
-        // 🔧 슬라이더의 첫 번째 광고도 자동 노출 추적 시작
-        if (adstageData.length > 0) {
-          setTimeout(() => {
-            this.startSimpleViewabilityTracking(slot, adstageData[0]);
-          }, 100); // 슬라이더 렌더링 완료 후 추적 시작
+        // 🔧 슬라이더는 CarouselSliderManager에서 자체적으로 모든 광고의 VIEWABLE 이벤트를 처리
+        if (this._config?.debug) {
+          console.log(`🎠 Slider will handle VIEWABLE events for ${adstageData.length} ads automatically`);
         }
       } else {
         // 광고가 1개면 일반 렌더링