PB-2064: shareshortlink cypress test

packages/viewer/src/api/icon.api.ts

@@ -3,12 +3,7 @@ import axios from 'axios'
 import { fromString } from 'ol/color'
 
 import { getViewerDedicatedServicesBaseUrl } from '@/config/baseUrl.config'
-import {
-    type FeatureStyleColor,
-    type FeatureStyleSize,
-    LARGE,
-    RED,
-} from '@/utils/featureStyleUtils'
+import { type FeatureStyleColor, LARGE, RED } from '@/utils/featureStyleUtils'
 
 /**
  * Generate an icon URL from its template. If no iconScale is given, the default scale 1 will be
@@ -17,19 +12,18 @@ import {
  *
  * @returns A full URL to this icon on the service-icons backend
  */
-export function generateIconURL(
-    icon: DrawingIcon,
-    iconColor: FeatureStyleColor = RED,
-    iconSize: FeatureStyleSize = LARGE
-) {
+export function generateIconURL(icon: DrawingIcon, iconColor: FeatureStyleColor = RED) {
     const rgb = fromString(iconColor.fill)
-    return icon.imageTemplateURL
-        .replace('{icon_set_name}', icon.iconSetName)
-        .replace('{icon_name}', icon.name)
-        .replace('{icon_scale}', iconSize.iconScale + 'x')
-        .replace('{r}', `${rgb[0]}`)
-        .replace('{g}', `${rgb[1]}`)
-        .replace('{b}', `${rgb[2]}`)
+    return (
+        icon.imageTemplateURL
+            .replace('{icon_set_name}', icon.iconSetName)
+            .replace('{icon_name}', icon.name)
+            // we always use the LARGE icon scale and resize the icon with the <IconStyle><scale> property in KMLs
+            .replace('{icon_scale}', LARGE.iconScale + 'x')
+            .replace('{r}', `${rgb[0]}`)
+            .replace('{g}', `${rgb[1]}`)
+            .replace('{b}', `${rgb[2]}`)
+    )
 }
 
 /**

packages/viewer/src/modules/infobox/components/styling/DrawingStyleMediaLink.vue

@@ -17,8 +17,8 @@ const emit = defineEmits<{
 }>()
 
 const { t } = useI18n()
-const generatedMediaLink = ref<string | undefined>(undefined)
-const linkDescription = ref<string | undefined>(undefined)
+const generatedMediaLink = ref<string>()
+const linkDescription = ref<string>()
 const isFormValid = ref<boolean>(false)
 const activateValidation = ref<boolean>(false)
 
@@ -117,14 +117,14 @@ function onUrlValidate(result: TextInputValidateResult): void {
                 placeholder="paste_url"
                 :validate="validateUrl"
                 data-cy="drawing-style-media-url"
-                @keydown.enter="addLink()"
+                @keydown.enter="addLink"
                 @validate="onUrlValidate"
             >
                 <button
                     class="btn btn-default btn-outline-group rounded-0 rounded-end"
                     type="button"
                     data-cy="drawing-style-media-generate-button"
-                    @click="addLink()"
+                    @click="addLink"
                 >
                     {{ t('add') }}
                 </button>

packages/viewer/src/store/modules/drawing/actions/closeDrawing.ts

@@ -41,7 +41,6 @@ export default async function closeDrawing(this: DrawingStore, dispatcher: Actio
             await debounceSaveDrawing({ debounceTime: 0, retryOnError: false })
         }
 
-
         if (this.layer.config) {
             // flagging the layer as not edited anymore (not displayed on the map by the drawing module anymore)
             if (!this.online) {
@@ -62,13 +61,7 @@ export default async function closeDrawing(this: DrawingStore, dispatcher: Actio
 
             delete this.layer.config
         }
-        this.toggleDrawingOverlay(
-            {
-                show: false,
-            },
-            dispatcher
-        )
-
+        this.overlay.show = false
         this.edit.featureType = undefined
         this.layer.ol?.getSource()?.clear()
 

packages/viewer/src/store/modules/drawing/actions/updateCurrentDrawingFeature.ts

@@ -8,13 +8,7 @@ import { generateIconURL } from '@/api/icon.api'
 import { DrawingSaveState } from '@/store/modules/drawing/types/DrawingSaveState.enum'
 import debounceSaveDrawing from '@/store/modules/drawing/utils/debounceSaveDrawing'
 import useProfileStore from '@/store/modules/profile'
-import {
-    calculateTextOffset,
-    type FeatureStyleColor,
-    type FeatureStyleSize,
-    MEDIUM,
-    RED,
-} from '@/utils/featureStyleUtils'
+import { calculateTextOffset } from '@/utils/featureStyleUtils'
 
 export default function updateCurrentDrawingFeature(
     this: DrawingStore,
@@ -24,21 +18,24 @@ export default function updateCurrentDrawingFeature(
     if (this.feature.current) {
         this.save.state = DrawingSaveState.UnsavedChanges
 
-        let needIconUrlRefresh = false
-
         Object.assign(this.feature.current, valuesToUpdate)
 
         // keeping values as preferred, if present, so that the next time the user draws, the values are used
         if (valuesToUpdate.iconSize) {
             this.edit.preferred.size = valuesToUpdate.iconSize
-            needIconUrlRefresh = true
         }
         if (valuesToUpdate.textSize) {
             this.edit.preferred.size = valuesToUpdate.textSize
         }
         if (valuesToUpdate.fillColor) {
             this.edit.preferred.color = valuesToUpdate.fillColor
-            needIconUrlRefresh = true
+            // refreshing the icon color if present
+            if (this.feature.current.icon) {
+                this.feature.current.icon.imageURL = generateIconURL(
+                    this.feature.current.icon,
+                    valuesToUpdate.fillColor
+                )
+            }
         }
         if (valuesToUpdate.textColor) {
             this.edit.preferred.color = valuesToUpdate.textColor
@@ -62,18 +59,6 @@ export default function updateCurrentDrawingFeature(
             }
         }
 
-        if (this.feature.current.icon && needIconUrlRefresh) {
-            const newIconSize: FeatureStyleSize =
-                valuesToUpdate.iconSize ?? this.feature.current.iconSize ?? MEDIUM
-            const newIconColor: FeatureStyleColor =
-                valuesToUpdate.fillColor ?? this.feature.current.fillColor ?? RED
-            this.feature.current.icon.imageURL = generateIconURL(
-                this.feature.current.icon,
-                newIconColor,
-                newIconSize
-            )
-        }
-
         const profileStore = useProfileStore()
         // updating the profile feature if the currently drawn feature is the profile feature
         if (profileStore.feature?.id === this.feature.current.id) {

packages/viewer/src/utils/__tests__/kmlUtils.spec.ts

@@ -12,7 +12,7 @@ import type { EditableFeature } from '@/api/features.api'
 import { type DrawingIconSet, generateIconURL } from '@/api/icon.api'
 import { getServiceKmlBaseUrl } from '@/config/baseUrl.config'
 import { fakeIconSets } from '@/utils/__tests__/legacyKmlUtils.spec'
-import { BLUE, EXTRA_LARGE } from '@/utils/featureStyleUtils'
+import { BLUE } from '@/utils/featureStyleUtils'
 import {
     getIcon,
     getKmlExtent,
@@ -350,7 +350,7 @@ describe('Test KML utils', () => {
                 'https://fake.image.url/api/icons/sets/default/icons/001-marker@1x-255,0,0.png'
             )
         })
-        it('get icon with standard arguments from the set with scale and color', () => {
+        it('get icon with standard arguments from the set with color', () => {
             const icon = getIcon(
                 {
                     set: 'default',
@@ -363,8 +363,8 @@ describe('Test KML utils', () => {
             expect(icon).toBeDefined()
             expect(icon!.name).to.be.equal('001-marker')
             expect(icon!.iconSetName).to.be.equal('default')
-            expect(generateIconURL(icon!, BLUE, EXTRA_LARGE)).to.be.equal(
-                'https://fake.image.url/api/icons/sets/default/icons/001-marker@1.25x-0,0,255.png'
+            expect(generateIconURL(icon!, BLUE)).to.be.equal(
+                'https://fake.image.url/api/icons/sets/default/icons/001-marker@1x-0,0,255.png'
             )
         })
         it('get icon with standard arguments from the babs set', () => {