Merge pull request #83 from ulixee/screen

Screen Sizes + Locale emulation
ulixee · Nov 2, 2020 · 6737007 · 6737007
2 parents 3523821 + 57cc7ff
commit 6737007
Show file tree

Hide file tree

Showing 47 changed files with 1,222 additions and 636 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -104,7 +104,7 @@ module.exports = {
   rules: {
     'import/no-named-as-default-member': 'off',
     'import/prefer-default-export': 'off',
-    'import/no-cycle': 'off', // TODO:we need to work throught this!!
+    'import/no-cycle': 'off', // TODO:we need to work through this!!
     'import/extensions': [
       'error',
       'ignorePackages',
@@ -116,7 +116,7 @@ module.exports = {
     // 'import/no-default-export': 'error',
     'import/no-extraneous-dependencies': [
       'error',
-      { devDependencies: ['**/test/**', '**/examples/**', '**/scripts/**'] },
+      { devDependencies: ['**/test/**', '**/examples/**', '**/scripts/**', '**/*.test.ts'] },
     ],
     'no-use-before-define': 'off', // use typescript one
     'no-prototype-builtins': 'off',

diff --git a/core-interfaces/ICreateSessionOptions.ts b/core-interfaces/ICreateSessionOptions.ts
@@ -1,10 +1,14 @@
 import IUserProfile from './IUserProfile';
 import ISessionOptions from './ISessionOptions';
 import IScriptInstanceMeta from './IScriptInstanceMeta';
+import IViewport from './IViewport';
 
 export default interface ICreateSessionOptions extends ISessionOptions {
   sessionName?: string;
   emulatorId?: string;
   userProfile?: IUserProfile;
   scriptInstanceMeta?: IScriptInstanceMeta;
+  viewport?: IViewport;
+  timezoneId?: string;
+  locale?: string;
 }
diff --git a/core-interfaces/IViewport.ts b/core-interfaces/IViewport.ts
@@ -8,19 +8,12 @@ export default interface IViewport {
    * @default 1
    */
   deviceScaleFactor?: number;
-  /**
-   * Whether the `meta viewport` tag is taken into account.
-   * @default false
-   */
-  isMobile?: boolean;
-  /**
-   * Specifies if viewport supports touch events.
-   * @default false
-   */
-  hasTouch?: boolean;
-  /**
-   * Specifies if viewport is in landscape mode.
-   * @default false
-   */
-  isLandscape?: boolean;
+  /** The screen width in pixels. */
+  screenWidth: number;
+  /** The screen height in pixels. */
+  screenHeight: number;
+  /** Overriding view X position on screen in pixels (minimum 0, maximum 10000000). */
+  positionX: number;
+  /** Overriding view Y position on screen in pixels (minimum 0, maximum 10000000). */
+  positionY: number;
 }
diff --git a/core/lib/Session.ts b/core/lib/Session.ts
@@ -18,6 +18,8 @@ import IPuppetContext, {
 import IUserProfile from '@secret-agent/core-interfaces/IUserProfile';
 import IBrowserEmulation from '@secret-agent/puppet/interfaces/IBrowserEmulation';
 import { IPuppetPage } from '@secret-agent/puppet/interfaces/IPuppetPage';
+import IViewport from '@secret-agent/core-interfaces/IViewport';
+import Viewport from '@secret-agent/emulators/lib/Viewport';
 import GlobalPool from './GlobalPool';
 import Tab from './Tab';
 import UserProfile from './UserProfile';
@@ -37,6 +39,9 @@ export default class Session {
   public browserContext?: IPuppetContext;
   public userProfile?: IUserProfile;
 
+  public viewport: IViewport;
+  public timezoneId?: string;
+
   public tabs: Tab[] = [];
 
   public get isClosing() {
@@ -55,6 +60,8 @@ export default class Session {
       this.userProfile = options.userProfile;
       this.emulator.setUserProfile(options.userProfile);
     }
+    if (options.locale) this.emulator.setLocale(options.locale);
+
     if (!this.emulator.canPolyfill) {
       log.warn('Emulator.PolyfillNotSupported', {
         sessionId: this.id,
@@ -64,6 +71,12 @@ export default class Session {
       });
     }
 
+    this.timezoneId = options.timezoneId;
+    this.viewport = options.viewport;
+    if (!this.viewport) {
+      this.viewport = Viewport.getRandom();
+    }
+
     const humanoidId = options.humanoidId || Humanoids.getRandomId();
     this.humanoid = Humanoids.create(humanoidId);
 
@@ -76,6 +89,8 @@ export default class Session {
       emulatorId,
       humanoidId,
       this.emulator.canPolyfill,
+      this.viewport,
+      this.timezoneId,
     );
     this.proxy = new MitmUpstreamProxy(this.id);
     this.mitmRequestSession = new RequestSession(
@@ -89,10 +104,12 @@ export default class Session {
   public getBrowserEmulation() {
     const emulator = this.emulator;
     return {
-      acceptLanguage: 'en-US,en',
+      locale: emulator.locale,
       userAgent: emulator.userAgent.raw,
       platform: emulator.userAgent.platform,
       proxyPassword: this.id,
+      viewport: this.viewport,
+      timezoneId: this.timezoneId,
     } as IBrowserEmulation;
   }
 

diff --git a/emulator-plugins/emulate-chrome-80/index.ts b/emulator-plugins/emulate-chrome-80/index.ts
@@ -90,7 +90,7 @@ export default class Chrome80 extends EmulatorPlugin {
       osVersion: `${os.major}.${os.minor}`,
       platform: this.userAgent.platform,
       memory: Math.ceil(Math.random() * 4) * 2,
-      languages: ['en-US', 'en'],
+      languages: this.locale.split(','),
       windowFrame,
       videoDevice: {
         // TODO: stabilize per user

diff --git a/emulator-plugins/emulate-chrome-83/index.ts b/emulator-plugins/emulate-chrome-83/index.ts
@@ -87,7 +87,7 @@ export default class Chrome83 extends EmulatorPlugin {
       osVersion: `${os.major}.${os.minor}`,
       platform: this.userAgent.platform,
       memory: Math.ceil(Math.random() * 4) * 2,
-      languages: ['en-US', 'en'],
+      languages: this.locale.split(','),
       windowFrame,
       videoDevice: {
         // TODO: stabilize per user

diff --git a/emulator-plugins/emulate-safari-13/index.ts b/emulator-plugins/emulate-safari-13/index.ts
@@ -122,7 +122,7 @@ export default class Safari13 extends EmulatorPlugin {
       osVersion: `${this.userAgent.os.major}.${this.userAgent.os.minor}`,
       platform: this.userAgent.platform,
       memory: Math.ceil(Math.random() * 4) * 2,
-      languages: ['en-US'],
+      languages: this.locale.split(','),
       videoDevice: {
         // TODO: stabilize per user
         deviceId: randomBytes(32).toString('hex'),

diff --git a/emulator-plugins/shared/injected-scripts/navigator.js b/emulator-plugins/shared/injected-scripts/navigator.js
@@ -1,25 +1,7 @@
 delete Navigator.prototype.webdriver;
 
 const props = {};
-const languages = args.languages;
-if (languages) {
-  for (const i of languages) {
-    Object.defineProperty(languages, i, {
-      ...Object.getOwnPropertyDescriptor(languages, i),
-      configurable: true,
-      enumerable: true,
-      writable: true,
-    });
-  }
-  Object.seal(languages);
-  Object.freeze(languages);
-  props.languages = { get: () => languages };
-  props.language = { get: () => languages[0] };
-}
 
-if (args.platform) {
-  props.platform = { get: () => args.platform };
-}
 if (args.memory) {
   props.deviceMemory = { get: () => args.memory };
 }

diff --git a/emulator-plugins/shared/test/chrome.test.ts b/emulator-plugins/shared/test/chrome.test.ts
@@ -91,8 +91,16 @@ async function createPage() {
     {
       proxyPassword: '',
       platform: 'win32',
-      acceptLanguage: 'en',
+      locale: 'en',
       userAgent: 'Chrome Test',
+      viewport: {
+        screenHeight: 900,
+        screenWidth: 1024,
+        positionY: 0,
+        positionX: 0,
+        height: 900,
+        width: 1024,
+      },
     },
     log,
   );

diff --git a/emulator-plugins/shared/test/plugins.test.ts b/emulator-plugins/shared/test/plugins.test.ts
@@ -33,8 +33,16 @@ test('it should override plugins in a browser window', async () => {
     {
       proxyPassword: '',
       platform: 'win32',
-      acceptLanguage: 'en',
+      locale: 'en',
       userAgent: 'Plugin Test',
+      viewport: {
+        screenHeight: 900,
+        screenWidth: 1024,
+        positionY: 0,
+        positionX: 0,
+        height: 900,
+        width: 1024,
+      },
     },
     log,
   );

diff --git a/emulator-plugins/shared/test/polyfills.test.ts b/emulator-plugins/shared/test/polyfills.test.ts
@@ -24,8 +24,16 @@ beforeAll(async () => {
     {
       proxyPassword: '',
       platform: 'win32',
-      acceptLanguage: 'en',
+      locale: 'en',
       userAgent: 'Chrome Test',
+      viewport: {
+        screenHeight: 900,
+        screenWidth: 1024,
+        positionY: 0,
+        positionX: 0,
+        height: 900,
+        width: 1024,
+      },
     },
     log,
   );

diff --git a/emulator-plugins/shared/test/utils.test.ts b/emulator-plugins/shared/test/utils.test.ts
@@ -64,8 +64,16 @@ test('should override a function and clean error stacks', async () => {
     {
       proxyPassword: '',
       platform: 'win32',
-      acceptLanguage: 'en',
+      locale: 'en',
       userAgent: 'Plugin Test',
+      viewport: {
+        screenHeight: 900,
+        screenWidth: 1024,
+        positionY: 0,
+        positionX: 0,
+        height: 900,
+        width: 1024,
+      },
     },
     log,
   );

diff --git a/emulators/data/resolution.json b/emulators/data/resolution.json
@@ -0,0 +1,146 @@
+{
+  "month": "2020-10",
+  "lastModified": "2020-10-30T15:58:20.354Z",
+  "sizes": [
+    {
+      "resolution": [
+        1920,
+        1080
+      ],
+      "percent": 19.91
+    },
+    {
+      "resolution": [
+        1366,
+        768
+      ],
+      "percent": 15.34
+    },
+    {
+      "resolution": [
+        1440,
+        900
+      ],
+      "percent": 9.1
+    },
+    {
+      "resolution": [
+        1536,
+        864
+      ],
+      "percent": 7.51
+    },
+    {
+      "resolution": [
+        1280,
+        720
+      ],
+      "percent": 4.71
+    },
+    {
+      "resolution": [
+        768,
+        1024
+      ],
+      "percent": 4.37
+    },
+    {
+      "resolution": [
+        1600,
+        900
+      ],
+      "percent": 3.88
+    },
+    {
+      "resolution": [
+        1280,
+        1024
+      ],
+      "percent": 3.38
+    },
+    {
+      "resolution": [
+        1024,
+        768
+      ],
+      "percent": 3.27
+    },
+    {
+      "resolution": [
+        1280,
+        800
+      ],
+      "percent": 3.15
+    },
+    {
+      "resolution": [
+        2560,
+        1440
+      ],
+      "percent": 2.73
+    },
+    {
+      "resolution": [
+        1680,
+        1050
+      ],
+      "percent": 2.43
+    },
+    {
+      "resolution": [
+        800,
+        600
+      ],
+      "percent": 1.51
+    },
+    {
+      "resolution": [
+        810,
+        1080
+      ],
+      "percent": 1.19
+    },
+    {
+      "resolution": [
+        1024,
+        1366
+      ],
+      "percent": 1.07
+    },
+    {
+      "resolution": [
+        1920,
+        1200
+      ],
+      "percent": 1.07
+    },
+    {
+      "resolution": [
+        834,
+        1112
+      ],
+      "percent": 1.05
+    },
+    {
+      "resolution": [
+        2048,
+        1152
+      ],
+      "percent": 0.7
+    },
+    {
+      "resolution": [
+        1360,
+        768
+      ],
+      "percent": 0.59
+    },
+    {
+      "resolution": [
+        1368,
+        912
+      ],
+      "percent": 0.5
+    }
+  ]
+}