Merge pull request #1767 from jdi-testing/issue_1598-pass-screen-reso…

…lution-to-predict-endpoints

Issue 1598: pass screen resolution to predict endpoints

manifest.json

@@ -3,7 +3,7 @@
   "name": "JDN — Page Object Generator",
   "description": "JDN – helps Test Automation Engineer to create Page Objects in the test automation framework and speed up test development",
   "devtools_page": "index.html",
-  "version": "3.16.4",
+  "version": "3.16.5",
   "icons": {
     "128": "icon128.png"
   },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "jdn-ai-chrome-extension",
-  "version": "3.16.4",
+  "version": "3.16.5",
   "description": "jdn-ai chrome extension",
   "scripts": {
     "start": "webpack --watch --env devenv",

src/common/utils/getViewportResolution.ts

@@ -0,0 +1,10 @@
+import connector from '../../pageServices/connector';
+
+export const getViewportResolution = async () => {
+  return await connector.attachContentScript(() => {
+    const width = window.innerWidth;
+    const height = window.innerHeight;
+
+    return { width, height };
+  });
+};

src/pageServices/pageDataHandlers.ts

@@ -6,6 +6,7 @@ import { getFullDocumentWithStyles } from '../common/utils/getFullDocumentWithSt
 import { ILocator, PredictedEntity } from '../features/locators/types/locator.types';
 import { getLibrarySelectors } from '../services/rules/createSelector';
 import { VueRules } from '../services/rules/Vue.rules';
+import { getViewportResolution } from '../common/utils/getViewportResolution';
 // /* global chrome */
 
 let overlayID: string;
@@ -59,10 +60,13 @@ Function returns predicted elements. */
 export const predictElements = (endpoint: HttpEndpoint): PredictElementsType => {
   let pageData: string;
 
-  return Promise.all([sendMessage.getPageData(), getFullDocumentWithStyles()])
-    .then(([pageDataResult, documentResult]) => {
+  return Promise.all([sendMessage.getPageData(), getFullDocumentWithStyles(), getViewportResolution()])
+    .then(([pageDataResult, documentResult, viewportResolution]) => {
       pageData = pageDataResult[0];
-      const payload = { elements: pageData, document: documentResult };
+
+      const viewport = JSON.stringify(viewportResolution[0].result);
+      const payload = { elements: pageData, document: documentResult, viewport };
+
       return sendToModel(payload, endpoint);
     })
     .then(