feat: change screen width and height value, add viewport attribute (#20)

Co-authored-by: xiaoweii <xiaoweii@amazom.com>

Author: zhu-xiaowei

src/provider/AnalyticsEventBuilder.ts

@@ -70,8 +70,10 @@ export class AnalyticsEventBuilder {
 			zone_offset: browserInfo.zoneOffset,
 			make: browserInfo.make,
 			platform: 'Web',
-			screen_height: window.innerHeight,
-			screen_width: window.innerWidth,
+			screen_height: window.screen.height,
+			screen_width: window.screen.width,
+			viewport_height: window.innerHeight,
+			viewport_width: window.innerWidth,
 			sdk_name: 'aws-solution-clickstream-sdk',
 			sdk_version: sdkVersion,
 			items: items,

src/types/Analytics.ts

@@ -92,6 +92,8 @@ export interface AnalyticsEvent {
 	locale: string;
 	screen_height: number;
 	screen_width: number;
+	viewport_height: number;
+	viewport_width: number;
 	zone_offset: number;
 	system_language: string;
 	country_code: string;

test/provider/AnalyticsEventBuilder.test.ts

@@ -28,6 +28,14 @@ describe('AnalyticsEventBuilder test', () => {
 			writable: true,
 			value: referrer,
 		});
+		Object.defineProperty(window.screen, 'width', {
+			writable: true,
+			value: 1920,
+		});
+		Object.defineProperty(window.screen, 'height', {
+			writable: true,
+			value: 1080,
+		});
 		const context = new ClickstreamContext(new BrowserInfo(), {
 			appId: 'testApp',
 			endpoint: 'https://example.com/collect',
@@ -53,6 +61,8 @@ describe('AnalyticsEventBuilder test', () => {
 		expect(event.sdk_name).toBe('aws-solution-clickstream-sdk');
 		expect(event.screen_height > 0).toBeTruthy();
 		expect(event.screen_width > 0).toBeTruthy();
+		expect(event.viewport_height > 0).toBeTruthy();
+		expect(event.viewport_width > 0).toBeTruthy();
 		expect(event.sdk_version).toBe(version);
 		expect(event.user).toStrictEqual({});
 		expect(Event.ReservedAttribute.PAGE_TITLE in event.attributes);