Skip to content

Commit

Permalink
fix(v3): remove exposed instances because they are always undefined a…
Browse files Browse the repository at this point in the history
…nd cause errors with watchers and events

* test(v3): update cypress runner to use typescript

* chore(v3): add space between lines

* refactor(v3): improve function recycling code

* fix(v3): add autocomplete-key and promise deferred pattern to autocomplete component

* test(v3): add autocomplete component test

* refactor(v3): fix typo on autocomplete word

* chore(v3): remove unnecessary console log

* chore(v3): update autocomplete slot comment

* test(v3): add autocomplete and map component tests

* test(v3): add marker component test

We also improved the map and autocomplete component tests

* test(v3): add circle component test

We also improved other tests adding unmounted tests

* test(v3): add cluster icon component test

We also improve the circle shape component tests.

* test(v3): add component test for drawing-manager

We also improved mocks on other component tests

* chore(root): add launch config to debug current test with vite

* test(v3): add component test for heatmap layer

* test(v3): add component test for info-window component

* test(v3): add component test for kml-layer component

* test(v3): add component test for polygon-shape component

* test(v3): add component test for polyline-shape component

* test(v3): add component test for street-view-panorama component

* test(v3): add tests for main.ts module

* fix(v3): remove exposed instances because they are always undefined

* test(v3): fix marker e2e tests after the last changes

* fix(v3): remove undefined instances and fix watchers

Solve: #318 #319

* test(v3): add component unit tests and fix e2e tests

Solve: #320

* chore(v3): add new script to build for development

* chore(root): update lock file

* refactor(v3): move component promises into a factory function.

* chore(root): upgrade node version on gh actions and update lock file

* chore(root): update lock file to pnpm version 9

* chore(root): update package-manager property on the root package
  • Loading branch information
diegoazh committed Apr 24, 2024
1 parent 635557c commit bdc2f86
Show file tree
Hide file tree
Showing 51 changed files with 19,973 additions and 14,114 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/publish.yml
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ jobs:

strategy:
matrix:
node-version: [16.x, 18.x, 20.x]
node-version: [18.x, 20.x, 21.x]
os: [ubuntu-latest, windows-latest]

steps:
Expand Down
11 changes: 11 additions & 0 deletions .vscode/launch.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,17 @@
"request": "launch",
"type": "node-terminal",
"cwd": "${workspaceFolder}/packages/documentation"
},
{
"type": "node",
"request": "launch",
"name": "Debug Current Test File",
"autoAttachChildProcesses": true,
"skipFiles": ["<node_internals>/**", "**/node_modules/**"],
"program": "${workspaceRoot}/packages/v3/node_modules/vitest/vitest.mjs",
"args": ["run", "${relativeFile}"],
"smartStep": true,
"console": "integratedTerminal"
}
]
}
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
"repository": "git@github.com:diegoazh/gmap-vue.git",
"author": "\"Daniel Sim, Guillaume Leclerc\",",
"license": "MIT",
"packageManager": "pnpm@8.15.6",
"packageManager": "pnpm@9.0.5",
"scripts": {
"serve:docs": "pnpm run --filter docs start",
"build:all": "pnpm run --recursive build",
Expand Down
3 changes: 2 additions & 1 deletion packages/v3/cypress/e2e/marker-icon.cy.ts
Original file line number Diff line number Diff line change
Expand Up @@ -40,11 +40,12 @@ describe('MarkerIcon component', () => {
.should('have.length', 4);
});

it('should empty the markers array from the map removing 2 of the 4 markers', function () {
it('should clean the markers array from the map removing 2 of the 4 markers', function () {
cy.visit('/');
cy.get('button[name=marker]').click();
cy.get('.gmv-map').should('exist');
cy.get('.gm-style').should('be.visible');
cy.get('.gmv-map').should('be.visible');
cy.get('#empty').click();
cy.get('.gmv-map')
.find('[class="GMAMP-maps-pin-view"]')
Expand Down
9 changes: 6 additions & 3 deletions packages/v3/cypress/runner/components/MarkerTest.vue
Original file line number Diff line number Diff line change
Expand Up @@ -18,28 +18,31 @@
:clickable="true"
:draggable="true"
:position="m.position"
:markerKey="`marker-${i}`"
@click="center = m.position"
></gmv-marker>
<gmv-marker
v-if="visible2"
:key="i"
:key="2"
:clickable="true"
:draggable="true"
:position="markers2[0].position"
:markerKey="`marker-2`"
@click="center = markers2[0].position"
></gmv-marker>
<gmv-marker
v-if="visible2"
:key="i"
:key="3"
:clickable="true"
:draggable="true"
:position="markers2[1].position"
:markerKey="`marker-3`"
@click="center = markers2[1].position"
></gmv-marker>
</gmv-map>
</template>

<script>
<script lang="ts">
export default {
data() {
return {
Expand Down
1 change: 1 addition & 0 deletions packages/v3/cypress/runner/components/PolygonTest.vue
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@ export default {
},
methods: {
updateEdited(mvcArray) {
console.info('>>>>> the event was fired successfully');
let paths = [];
for (let i = 0; i < mvcArray.getLength(); i++) {
let path = [];
Expand Down
99 changes: 99 additions & 0 deletions packages/v3/cypress/runner/components/TwoMapsInSamePage.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,99 @@
<template>
<GmvMap
ref="mapRef"
class="map"
:center="center"
:zoom="7"
mapId="DEMO_MAP_ID"
mapKey="firstMap"
>
<!-- <GmvInfoWindow
:content="'<strong style=\'color:black\'>Marker 1</strong>'"
:marker="markerRef?.markerInstance"
:opened="infoWinOpen"
:position="{ lat: 1.0, lng: 100.0 }"
@closeclick="toggleInfoWindow"
/> -->
<GmvMarker
v-if="mapRef"
ref="markerRef"
:position="{ lat: 1.0, lng: 100.0 }"
@click="toggleInfoWindow"
/>
</GmvMap>

<br />
<br />

<GmvMap
ref="mapRef2"
class="map"
:center="center"
:zoom="7"
mapId="DEMO_MAP_ID"
:options="{ recycle: 'secondMap' }"
>
<!-- <GmvInfoWindow
:content="'<strong style=\'color:black\'>Marker 1</strong>'"
:marker="markerRef2?.markerInstance"
:opened="infoWinOpen"
:position="center"
@closeclick="toggleInfoWindow"
/> -->
<GmvMarker
v-if="mapRef2"
ref="markerRef2"
:position="center"
@click="toggleInfoWindow"
/>
</GmvMap>
</template>
<script setup lang="ts">
import type { MapLayer, Marker } from '@gmap-vue/v3/components';
import { useMapPromise } from '@gmap-vue/v3/composables';
import { ComponentInstance, onMounted, ref } from 'vue';
const mapRef = ref<ComponentInstance<typeof MapLayer> | null>(null);
const mapRef2 = ref<ComponentInstance<typeof MapLayer> | null>(null);
const markerRef = ref<ComponentInstance<typeof Marker> | null>(null);
const markerRef2 = ref<ComponentInstance<typeof Marker> | null>(null);
const infoWinOpen = ref<boolean>(false);
const mapPromise = useMapPromise('firstMap');
const mapPromise2 = useMapPromise('secondMap');
const center = {
lat: 1.32,
lng: 103.8,
};
function toggleInfoWindow() {
console.log('clicked...', infoWinOpen.value);
infoWinOpen.value = !infoWinOpen.value;
}
onMounted(() => {
mapPromise?.then((map) => {
if (map) {
setTimeout(() => {
map.panTo({ lat: 1.0, lng: 100.0 });
console.log(mapRef.value?.getRecycleKey());
console.log(mapRef2.value?.getRecycleKey());
}, 2000);
}
});
mapPromise2?.then((map) => {
if (map) {
setTimeout(() => {
map.panTo({ lat: 1.0, lng: 100.0 });
console.log(mapRef.value?.getRecycleKey());
console.log(mapRef2.value?.getRecycleKey());
}, 2000);
}
});
});
</script>
<style scoped>
.map {
height: 50vh;
width: 50vw;
}
</style>
2 changes: 1 addition & 1 deletion packages/v3/cypress/runner/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<title>Vite App</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.js"></script>
<script src="./main.js" type="module"></script>
<script src="./main.ts" type="module"></script>
</head>
<body>
<div id="app"></div>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,8 +1,17 @@
/// <reference types="vite/client" />
import { createApp } from 'vue';
import { createGmapVuePlugin } from '../../dist/main.es';
import App from './components/App.vue';
import '@gmap-vue/v3/dist/style.css';

declare global {
interface Window {
google: typeof google;

[key: string | number | symbol]: any;
}
}

window.app = createApp(App)
.use(
createGmapVuePlugin({
Expand All @@ -12,6 +21,7 @@ window.app = createApp(App)
load: {
key: import.meta.env.VITE_GOOGLE_API_KEY,
libraries: 'places,visualization,drawing',
mapIds: ['DEMO_MAP_ID'],
},
}),
)
Expand Down
25 changes: 25 additions & 0 deletions packages/v3/cypress/runner/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"module": "ESNext",
"lib": ["ES2020", "DOM", "DOM.Iterable"],
"skipLibCheck": true,

/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "preserve",

/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"],
"references": [{ "path": "./tsconfig.node.json" }]
}
10 changes: 10 additions & 0 deletions packages/v3/cypress/runner/tsconfig.node.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
{
"compilerOptions": {
"composite": true,
"skipLibCheck": true,
"module": "ESNext",
"moduleResolution": "bundler",
"allowSyntheticDefaultImports": true
},
"include": ["vite.config.mts"]
}
10 changes: 10 additions & 0 deletions packages/v3/cypress/runner/vite-env.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/// <reference types="vite/client" />

interface ImportMetaEnv {
readonly VITE_GOOGLE_API_KEY: string;
// more env variables...
}

interface ImportMeta {
readonly env: ImportMetaEnv;
}
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import vue from '@vitejs/plugin-vue';
import { resolve } from 'path';
import { fileURLToPath, URL } from 'url';
import { defineConfig } from 'vite';
import { resolve } from 'path';

// https://vitejs.dev/config/
export default defineConfig({
Expand All @@ -18,6 +18,6 @@ export default defineConfig({
},
server: {
hmr: true,
watch: true,
watch: { cwd: '.' },
},
});
6 changes: 4 additions & 2 deletions packages/v3/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,7 @@
"dev:e2e": "pnpm run build && vite --config cypress/runner/vite.config.js",
"preview": "vite preview --port 4173",
"build": "vite build",
"build:dev": "vite build --mode development",
"tsc:build": "tsc --project tsconfig.app.json",
"vite:build": "run-p type-check build",
"type-check": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",
Expand All @@ -97,8 +98,8 @@
"coverage": "vitest run --coverage",
"test:e2e": "cypress install && start-server-and-test test:e2e:vite:server http://localhost:4173/ 'pnpm exec cypress open --e2e'",
"test:e2e:ci": "start-server-and-test test:e2e:vite:server http://localhost:4173/ 'pnpm exec cypress run --e2e'",
"test:e2e:build": "pnpm run build && vite build --config cypress/runner/vite.config.mjs",
"test:e2e:preview": "vite preview --config cypress/runner/vite.config.mjs",
"test:e2e:build": "pnpm run build && vite build --config cypress/runner/vite.config.mts",
"test:e2e:preview": "vite preview --config cypress/runner/vite.config.mts",
"test:e2e:vite:server": "pnpm run test:e2e:build && pnpm run test:e2e:preview",
"test:e2e:node:server": "pnpm run test:e2e:build && node cypress/runner/runner.cjs",
"lint": "prettier --write ./src && eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
Expand Down Expand Up @@ -135,6 +136,7 @@
"@vitest/coverage-istanbul": "^1.4.0",
"@vue/eslint-config-prettier": "^9.0.0",
"@vue/eslint-config-typescript": "^13.0.0",
"@vue/test-utils": "^2.4.5",
"@vue/tsconfig": "^0.5.1",
"cpx": "^1.5.0",
"cypress": "^13.7.1",
Expand Down
Loading

0 comments on commit bdc2f86

Please sign in to comment.