tests

package.json

@@ -36,12 +36,13 @@
   "author": "2GIS WebMaps Team",
   "license": "BSD-2-Clause",
   "devDependencies": {
-    "@2gis/mapgl": "^1.47.0",
+    "@2gis/mapgl": "^1.52.0",
     "@documentalist/compiler": "^2.8.1",
     "@types/geojson": "^7946.0.10",
     "@types/jest": "^27.4.0",
     "@types/jest-image-snapshot": "^4.3.1",
     "@types/puppeteer": "^5.4.4",
+    "@types/sinon": "^17.0.3",
     "clean-webpack-plugin": "^4.0.0",
     "copy-webpack-plugin": "^11.0.0",
     "css-loader": "^3.6.0",
@@ -53,6 +54,7 @@
     "prettier": "^2.8.7",
     "puppeteer": "^13.3.2",
     "raw-loader": "^4.0.2",
+    "sinon": "^19.0.2",
     "style-loader": "^1.3.0",
     "ts-jest": "^27.1.3",
     "ts-loader": "^9.4.2",

src/types/plugin.ts

@@ -86,9 +86,18 @@ export interface PluginOptions {
      * on the map so that user could manage draw order of the plugin and these objects.
      */
     zIndex?: number;
-
+    /**
+     * Minimum display styleZoom for all models.
+     */
     minZoom?: number;
+    /**
+     * Maximum display styleZoom for all models.
+     */
     maxZoom?: number;
+    /**
+     * A distance to the camera the models get transparent from.
+     * It's set in units along Z axis of the WebGL space.
+     */
     modelsNearCameraFade?: number;
 }
 
@@ -163,8 +172,13 @@ export interface ModelOptions {
      * Interactivity of a model. The model isn't interactive by default.
      */
     interactive?: boolean;
-
+    /**
+     * Minimum display styleZoom of the model.
+     */
     minZoom?: number;
+    /**
+     * Maximum display styleZoom of the model.
+     */
     maxZoom?: number;
 }
 

test/index.ts

@@ -1,5 +1,7 @@
+import * as sinon from 'sinon';
 import { GltfPlugin } from '../src';
 import { MOCKS } from './mocks';
 
 window.GltfPlugin = GltfPlugin;
 window.MOCKS = MOCKS; // storage for any data for tests
+window.sinon = sinon;

test/integration/events.ts

@@ -0,0 +1,48 @@
+import { Page, pageSetUp } from '../puppeteer';
+import { initBlankMap, waitForReadiness } from '../puppeteer/utils';
+
+describe('Events', () => {
+    let page: Page;
+
+    beforeEach(async () => {
+        page = await pageSetUp();
+        await initBlankMap(page, {
+            center: [47.245286302641034, 56.134743473834099],
+            styleZoom: 18,
+        });
+        await page.evaluate(() => {
+            window.gltfPlugin = new window.GltfPlugin(window.map, {
+                modelsBaseUrl:
+                    'https://disk.2gis.com/digital-twin/models_s3/realty_ads/zgktechnology/',
+            });
+        });
+    });
+
+    afterEach(async () => {
+        await page.close();
+    });
+
+    describe('activemodelchange', () => {
+        it('activemodelchange is emitted on adding realty scene with a state', async () => {
+            const buildingId = '03a234cb';
+            const floorId = '235034';
+            await page.evaluate(
+                (buildingId, floorId) => {
+                    window.spy = window.sinon.spy();
+                    window.gltfPlugin.on('activemodelchange', window.spy);
+                    return window.gltfPlugin.addRealtyScene(window.MOCKS.realtyScene, {
+                        buildingId,
+                        floorId,
+                    });
+                },
+                buildingId,
+                floorId,
+            );
+            await waitForReadiness(page);
+            expect(await page.evaluate(() => window.spy.firstCall.args[0])).toEqual({
+                buildingModelId: buildingId,
+                floorModelId: floorId,
+            });
+        });
+    });
+});

test/mocks/index.ts

@@ -1,11 +1,14 @@
-import { MODEL_CUBE_BIG, MODEL_CUBE_SMALL } from './models';
+import { MODEL_CUBE_BIG, MODEL_CUBE_MID, MODEL_CUBE_SMALL, MODEL_PALM, MODEL_PINE } from './models';
 import { LABEL_ASCII_LETTERS, LABEL_ENG_RUS_LETTERS } from './labels';
 import { REALTY_SCENE } from './realtyScene';
 
 export const MOCKS = {
     models: {
         cubeBig: MODEL_CUBE_BIG,
+        cubeMid: MODEL_CUBE_MID,
         cubeSmall: MODEL_CUBE_SMALL,
+        palm: MODEL_PALM,
+        pine: MODEL_PINE,
     },
     labels: {
         asciiLetters: LABEL_ASCII_LETTERS,

test/mocks/models.ts

@@ -1,6 +1,6 @@
 import { BuildingOptions } from '../../src/types/realtyScene';
 
-export const MODEL_CUBE_BIG: BuildingOptions = {
+export const MODEL_CUBE_MID: BuildingOptions = {
     modelId: '1',
     coordinates: [82.886554, 54.98085],
     modelUrl: `${location.origin}/models/cube_draco.glb`,
@@ -14,3 +14,24 @@ export const MODEL_CUBE_SMALL: BuildingOptions = {
     rotateZ: 31,
     scale: 1,
 };
+
+export const MODEL_CUBE_BIG: BuildingOptions = {
+    modelId: '3',
+    coordinates: [82.886554, 54.98085],
+    modelUrl: `${location.origin}/models/cube_draco.glb`,
+    scale: 10,
+};
+
+export const MODEL_PALM: BuildingOptions = {
+    modelId: '4',
+    coordinates: [82.88378289287995, 54.90501866207913],
+    modelUrl: `${location.origin}/models/palm.glb`,
+    scale: 3,
+};
+
+export const MODEL_PINE: BuildingOptions = {
+    modelId: '5',
+    coordinates: [82.88520478969967, 54.90440124749836],
+    modelUrl: `${location.origin}/models/pine.glb`,
+    scale: 3,
+};