diff --git a/src/modules/drawing/components/DrawingExporter.vue b/src/modules/drawing/components/DrawingExporter.vue
index 777c246e2..2a78caa33 100644
--- a/src/modules/drawing/components/DrawingExporter.vue
+++ b/src/modules/drawing/components/DrawingExporter.vue
@@ -1,20 +1,22 @@
 <script setup>
 import { saveAs } from 'file-saver'
 import { computed, inject, ref } from 'vue'
-import { useI18n } from 'vue-i18n'
 import { useStore } from 'vuex'
 
 import { generateGpxString, generateKmlString } from '@/modules/drawing/lib/export-utils'
-import DropdownButton, { DropdownItem } from '@/utils/components/DropdownButton.vue'
+import DropdownButton from '@/utils/components/DropdownButton.vue'
 import { generateFilename } from '@/utils/utils'
 
-const exportOptions = [new DropdownItem('kml', 'KML'), new DropdownItem('gpx', 'GPX')]
+/** @type {DropdownItem[]} */
+const exportOptions = [
+    { id: 'kml', title: 'KML' },
+    { id: 'gpx', title: 'GPX' },
+]
 
 const drawingLayer = inject('drawingLayer')
 
-const exportSelection = ref('KML')
+const exportSelection = ref(exportOptions[0].title)
 
-const i18n = useI18n()
 const store = useStore()
 
 const projection = computed(() => store.state.position.projection)
@@ -22,7 +24,7 @@ const isDrawingEmpty = computed(() => store.getters.isDrawingEmpty)
 const activeKmlLayer = computed(() => store.getters.activeKmlLayer)
 
 function onExportOptionSelected(dropdownItem) {
-    exportSelection.value = dropdownItem.value
+    exportSelection.value = dropdownItem.title
     exportDrawing()
 }
 function exportDrawing() {
@@ -47,13 +49,13 @@ function exportDrawing() {
 
 <template>
     <DropdownButton
-        :title="i18n.t('export_kml')"
+        title="export_kml"
         :current-value="exportSelection"
         :items="exportOptions"
         :disabled="isDrawingEmpty"
         with-toggle-button
         data-cy="drawing-toolbox-export-button"
-        @select:item="onExportOptionSelected"
+        @select-item="onExportOptionSelected"
         @click="exportDrawing()"
     />
 </template>
diff --git a/src/modules/i18n/index.js b/src/modules/i18n/index.js
index 71c6339ec..c5bbcb5c8 100644
--- a/src/modules/i18n/index.js
+++ b/src/modules/i18n/index.js
@@ -55,6 +55,9 @@ const i18n = createI18n({
     messages: languages,
     legacy: false,
     datetimeFormats,
+    // no error if missing translation, just display the input untranslated.
+    missingWarn: false,
+    fallbackWarn: false,
 })
 
 export default i18n
diff --git a/src/modules/infobox/components/styling/DrawingStyleIconSelector.vue b/src/modules/infobox/components/styling/DrawingStyleIconSelector.vue
index 75d44dc09..154932464 100644
--- a/src/modules/infobox/components/styling/DrawingStyleIconSelector.vue
+++ b/src/modules/infobox/components/styling/DrawingStyleIconSelector.vue
@@ -14,7 +14,7 @@
                     :items="iconSetDropdownItems"
                     :current-value="currentIconSet"
                     data-cy="drawing-style-icon-set-button"
-                    @select:item="changeDisplayedIconSet"
+                    @select-item="changeDisplayedIconSet"
                 />
             </div>
         </div>
@@ -84,7 +84,7 @@ import EditableFeature from '@/api/features/EditableFeature.class'
 import { SUPPORTED_LANG } from '@/modules/i18n/index'
 import DrawingStyleColorSelector from '@/modules/infobox/components/styling/DrawingStyleColorSelector.vue'
 import DrawingStyleSizeSelector from '@/modules/infobox/components/styling/DrawingStyleSizeSelector.vue'
-import DropdownButton, { DropdownItem } from '@/utils/components/DropdownButton.vue'
+import DropdownButton from '@/utils/components/DropdownButton.vue'
 import { useTippyTooltip } from '@/utils/composables/useTippyTooltip'
 import { MEDIUM } from '@/utils/featureStyleUtils'
 import log from '@/utils/logging'
@@ -142,16 +142,17 @@ export default {
                   })
                 : ''
         },
+        /** @returns {DropdownItem[]} */
         iconSetDropdownItems() {
             return this.iconSets.map((iconSet) => {
-                return new DropdownItem(
-                    iconSet.name,
-                    this.i18n.t(`modify_icon_category_${iconSet.name}_label`, 1, {
+                return {
+                    id: iconSet.name,
+                    title: this.i18n.t(`modify_icon_category_${iconSet.name}_label`, 1, {
                         locale: iconSet.language,
                     }),
-                    iconSet,
-                    `modify_icon_category_${iconSet.name}_label`
-                )
+                    value: iconSet,
+                    description: `modify_icon_category_${iconSet.name}_label`,
+                }
             })
         },
     },
diff --git a/src/modules/infobox/components/styling/DrawingStyleSizeSelector.vue b/src/modules/infobox/components/styling/DrawingStyleSizeSelector.vue
index 70bb30ce7..ab4c554ee 100644
--- a/src/modules/infobox/components/styling/DrawingStyleSizeSelector.vue
+++ b/src/modules/infobox/components/styling/DrawingStyleSizeSelector.vue
@@ -1,23 +1,27 @@
+<script setup>
+import { useI18n } from 'vue-i18n'
+
+const { t } = useI18n()
+</script>
+
 <template>
     <div>
         <label class="form-label" for="drawing-style-text-size-selector">
-            {{ $t('modify_text_size_label') }}
+            {{ t('modify_text_size_label') }}
         </label>
         <DropdownButton
             id="drawing-style-text-size-selector"
             data-cy="drawing-style-size-selector"
             :current-value="currentSize"
-            :title="$t(sizeLabel)"
+            :title="sizeLabel"
             :items="dropdownItems"
-            @select:item="onSizeSelect"
+            @select-item="onSizeSelect"
         />
     </div>
 </template>
 
 <script>
-import { useI18n } from 'vue-i18n'
-
-import DropdownButton, { DropdownItem } from '@/utils/components/DropdownButton.vue'
+import DropdownButton from '@/utils/components/DropdownButton.vue'
 import { allStylingSizes, FeatureStyleSize } from '@/utils/featureStyleUtils'
 
 export default {
@@ -29,12 +33,6 @@ export default {
         },
     },
     emits: ['change'],
-    setup() {
-        const i18n = useI18n()
-        return {
-            i18n,
-        }
-    },
     data() {
         return {
             sizes: allStylingSizes,
@@ -47,9 +45,10 @@ export default {
             }
             return this.currentSize.label
         },
+        /** @returns {DropdownItem[]} */
         dropdownItems() {
             return this.sizes.map((size) => {
-                return new DropdownItem(size.label, this.i18n.t(size.label), size)
+                return { id: size.label, title: size.label, value: size }
             })
         },
     },
diff --git a/src/modules/menu/components/activeLayers/MenuActiveLayersListItem.vue b/src/modules/menu/components/activeLayers/MenuActiveLayersListItem.vue
index ad501af5b..3c294cb5d 100644
--- a/src/modules/menu/components/activeLayers/MenuActiveLayersListItem.vue
+++ b/src/modules/menu/components/activeLayers/MenuActiveLayersListItem.vue
@@ -13,7 +13,7 @@ import AbstractLayer from '@/api/layers/AbstractLayer.class'
 import KMLLayer from '@/api/layers/KMLLayer.class'
 import { allKmlStyles } from '@/api/layers/KmlStyles.enum'
 import MenuActiveLayersListItemTimeSelector from '@/modules/menu/components/activeLayers/MenuActiveLayersListItemTimeSelector.vue'
-import DropdownButton, { DropdownItem } from '@/utils/components/DropdownButton.vue'
+import DropdownButton from '@/utils/components/DropdownButton.vue'
 import ErrorButton from '@/utils/components/ErrorButton.vue'
 import TextTruncate from '@/utils/components/TextTruncate.vue'
 import ThirdPartyDisclaimer from '@/utils/components/ThirdPartyDisclaimer.vue'
@@ -70,8 +70,9 @@ const transparencySlider = ref(null)
 const currentKmlStyle = ref(layer.value?.style ?? null)
 const id = computed(() => layer.value.id)
 
+/** @type {ComputedRef<DropdownItem[]>} */
 const kmlStylesAsDropdownItems = computed(() =>
-    allKmlStyles.map((style) => new DropdownItem(style, style.toLowerCase(), style))
+    allKmlStyles.map((style) => ({ id: style, title: style.toLowerCase(), value: style }))
 )
 
 const isLocalFile = computed(() => store.getters.isLocalFile(layer.value))
@@ -338,7 +339,7 @@ function changeStyle(newStyle) {
                         :items="kmlStylesAsDropdownItems"
                         :current-value="currentKmlStyle"
                         small
-                        @select:item="changeStyle"
+                        @select-item="changeStyle"
                     />
                 </div>
             </div>
diff --git a/src/modules/menu/components/help/ReportProblemButton.vue b/src/modules/menu/components/help/ReportProblemButton.vue
index dbefaf074..7ff61a708 100644
--- a/src/modules/menu/components/help/ReportProblemButton.vue
+++ b/src/modules/menu/components/help/ReportProblemButton.vue
@@ -8,7 +8,7 @@ import { createShortLink } from '@/api/shortlink.api'
 import { FEEDBACK_EMAIL_SUBJECT } from '@/config/feedback.config'
 import HeaderLink from '@/modules/menu/components/header/HeaderLink.vue'
 import SendActionButtons from '@/modules/menu/components/help/common/SendActionButtons.vue'
-import DropdownButton, { DropdownItem } from '@/utils/components/DropdownButton.vue'
+import DropdownButton from '@/utils/components/DropdownButton.vue'
 import EmailInput from '@/utils/components/EmailInput.vue'
 import FileInput from '@/utils/components/FileInput.vue'
 import SimpleWindow from '@/utils/components/SimpleWindow.vue'
@@ -22,27 +22,28 @@ const acceptedFileTypes = ['.kml', '.gpx', '.pdf', '.zip', '.jpg', '.jpeg', '.km
 
 const i18n = useI18n()
 const store = useStore()
+/** @type {DropdownItem[]} */
 const feedbackCategories = [
-    new DropdownItem(
-        'feedback_category_background_map',
-        i18n.t('feedback_category_background_map'),
-        'feedback_category_background_map'
-    ),
-    new DropdownItem(
-        'feedback_category_thematic_map',
-        i18n.t('feedback_category_thematic_map'),
-        'feedback_category_thematic_map'
-    ),
-    new DropdownItem(
-        'feedback_category_application_service',
-        i18n.t('feedback_category_application_service'),
-        'feedback_category_application_service'
-    ),
-    new DropdownItem(
-        'feedback_category_other',
-        i18n.t('feedback_category_other'),
-        'feedback_category_other'
-    ),
+    {
+        id: 'background_map',
+        title: 'feedback_category_background_map',
+        value: 'background_map',
+    },
+    {
+        id: 'thematic_map',
+        title: 'feedback_category_thematic_map',
+        value: 'thematic_map',
+    },
+    {
+        id: 'application_service',
+        title: 'feedback_category_application_service',
+        value: 'application_service',
+    },
+    {
+        id: 'other',
+        title: 'feedback_category_other',
+        value: 'other',
+    },
 ]
 
 const props = defineProps({
@@ -149,6 +150,7 @@ async function sendReportProblem() {
 function closeAndCleanForm() {
     activateValidation.value = false
     showReportProblemForm.value = false
+    feedback.value.category = null
     feedback.value.message = null
     feedback.value.email = null
     feedback.value.file = null
@@ -220,28 +222,26 @@ function selectItem(dropdownItem) {
         :hide="showDrawingOverlay"
         initial-position="top-right"
         movable
+        data-cy="report-problem-window"
         @close="closeAndCleanForm"
     >
         <div v-if="!request.completed" class="report-problem" data-cy="report-problem-form">
             <div class="mb-2 fw-bold">
                 {{ i18n.t('feedback_category') }}
             </div>
-            <div
+            <DropdownButton
+                label="feedback_description"
+                :title="feedback.category ?? 'select_category'"
+                :current-value="feedback.category"
+                :items="feedbackCategories"
+                data-cy="report-problem-category"
                 class="my-2"
                 :class="{
                     'is-valid': feedback.category,
                     'is-invalid': !feedback.category && activateValidation,
                 }"
-                data-cy="report-feedback-category-dropdown"
-            >
-                <DropdownButton
-                    label="feedback_description"
-                    :title="i18n.t(feedback.category ?? 'select_category')"
-                    :current-value="feedback.category"
-                    :items="feedbackCategories"
-                    @select:item="selectItem"
-                />
-            </div>
+                @select-item="selectItem"
+            />
             <div class="invalid-feedback" data-cy="text-area-input-invalid-feedback">
                 {{ i18n.t('category_not_selected_warning') }}
             </div>
@@ -253,7 +253,7 @@ function selectItem(dropdownItem) {
                     label="feedback_description"
                     :disabled="request.pending"
                     required
-                    data-cy="report-problem"
+                    data-cy="report-problem-text-area"
                     :activate-validation="activateValidation"
                     invalid-message="feedback_empty_warning"
                     @validate="onTextValidate"
@@ -292,7 +292,7 @@ function selectItem(dropdownItem) {
                     :disabled="request.pending"
                     :description="'no_email_feedback'"
                     :activate-validation="activateValidation"
-                    data-cy="report-problem"
+                    data-cy="report-problem-email"
                     @validate="onEmailValidate"
                 />
             </div>
@@ -306,7 +306,7 @@ function selectItem(dropdownItem) {
                     :activate-validation="activateValidation"
                     :disabled="request.pending"
                     :max-file-size="ATTACHMENT_MAX_SIZE"
-                    data-cy="report-problem"
+                    data-cy="report-problem-file"
                     @validate="onAttachmentValidate"
                 />
             </div>
diff --git a/src/utils/components/DropdownButton.vue b/src/utils/components/DropdownButton.vue
index 12d69625e..fa95312fd 100644
--- a/src/utils/components/DropdownButton.vue
+++ b/src/utils/components/DropdownButton.vue
@@ -1,3 +1,113 @@
+<script setup>
+/**
+ * Manages a Bootstrap dropdown.
+ *
+ * All items must be passed as instances of DropdownItem (imported from the same file as the
+ * component). The active item (the one with the .active CSS class) will be defined by comparing the
+ * props `currentValue` with each item's value.
+ *
+ * It is possible to have the dropdown attached to an extra button with a caret, instead of all
+ * inline. For that you have to add the with-toggle-button HTML attribute to the component use
+ */
+
+import { Dropdown } from 'bootstrap'
+import { onBeforeUnmount, onMounted, ref, toRefs, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import { useTippyTooltip } from '@/utils/composables/useTippyTooltip'
+import { randomIntBetween } from '@/utils/numberUtils'
+
+/**
+ * @typedef DropdownItem
+ *
+ *   Represents an option in the select made for a dropdown. If no value is given, the title of the
+ *   item will be considered the value.
+ * @property {String | Number} id
+ * @property {String} title
+ * @property {String | Number | Object} [value]
+ * @property {String} [description]
+ */
+
+const props = defineProps({
+    title: {
+        type: String,
+        required: true,
+    },
+    currentValue: {
+        type: [Object, String, Number, Boolean, null],
+        required: true,
+    },
+    /** @type DropdownItem[] */
+    items: {
+        type: Array,
+        required: true,
+        validator: (items) => {
+            // checking that we received an array of only DropdownItem instances with at least one item
+            if (Array.isArray(items) && items.length > 1) {
+                return items.filter((item) => !!item?.id && !!item?.title).length === items.length
+            }
+            return false
+        },
+    },
+    withToggleButton: {
+        type: Boolean,
+        default: false,
+    },
+    disabled: {
+        type: Boolean,
+        default: false,
+    },
+    small: {
+        type: Boolean,
+        default: false,
+    },
+})
+const { title, currentValue, items, withToggleButton, disabled, small } = toRefs(props)
+
+const emits = defineEmits({ click: () => true, selectItem: (item) => item?.id && item?.title })
+
+const { t } = useI18n()
+
+const dropdownMenu = ref(null)
+const dropdownToggleButton = ref(null)
+const dropdownMainButton = ref(null)
+
+// generating a unique HTML ID for this dropdown
+const uniqueHtmlId = ref(`dropdown-${randomIntBetween(0, 10000)}`)
+
+useTippyTooltip('.dropdown-item[data-tippy-content]', { placement: 'left' })
+
+let dropdown = null
+onMounted(() => {
+    if (withToggleButton.value) {
+        dropdown = new Dropdown(dropdownToggleButton.value)
+    } else {
+        dropdown = new Dropdown(dropdownMainButton.value)
+    }
+})
+onBeforeUnmount(() => {
+    dropdown.dispose()
+})
+
+watch(disabled, (isDisabled) => {
+    if (isDisabled) {
+        // hiding the dropdown body if component becomes disabled
+        dropdownMenu.value.classList.remove('show')
+    }
+})
+
+function onMainButtonClick() {
+    if (withToggleButton.value) {
+        // letting the parent component handle what to do by sending an event
+        emits('click')
+    }
+}
+
+function selectItem(item) {
+    emits('selectItem', item)
+}
+</script>
+
 <template>
     <div :class="{ 'btn-group': withToggleButton }">
         <button
@@ -12,7 +122,7 @@
             :aria-expanded="false"
             @click="onMainButtonClick"
         >
-            {{ title }}
+            {{ t(title) }}
         </button>
         <button
             v-if="withToggleButton"
@@ -32,140 +142,18 @@
             <li v-for="item in items" :key="item.id">
                 <a
                     class="dropdown-item"
-                    :class="{ active: currentValue === item.value }"
+                    :class="{ active: currentValue === (item.value ?? item.title) }"
                     :data-tippy-content="item.description"
                     :data-cy="`dropdown-item-${item.id}`"
                     @click="selectItem(item)"
                 >
-                    {{ item.title }}
+                    {{ t(item.title) }}
                 </a>
             </li>
         </ul>
     </div>
 </template>
 
-<script>
-import { Dropdown } from 'bootstrap'
-
-import { useTippyTooltip } from '@/utils/composables/useTippyTooltip'
-import { randomIntBetween } from '@/utils/numberUtils'
-
-/**
- * Represents an option in the select made for a dropdown. If no value is given, the title of the
- * item will be considered the value.
- */
-export class DropdownItem {
-    constructor(id, title, value = null, description = null) {
-        this._id = id
-        this._title = title
-        this._value = value || title
-        this._description = description
-    }
-
-    get id() {
-        return this._id
-    }
-
-    get title() {
-        return this._title
-    }
-    get value() {
-        return this._value
-    }
-    get description() {
-        return this._description
-    }
-}
-
-/**
- * Manages a Bootstrap dropdown.
- *
- * All items must be passed as instances of DropdownItem (imported from the same file as the
- * component). The active item (the one with the .active CSS class) will be defined by comparing the
- * props `currentValue` with each item's value.
- *
- * It is possible to have the dropdown attached to an extra button with a caret, instead of all
- * inline. For that you have to add the with-toggle-button HTML attribute to the component use
- */
-export default {
-    props: {
-        title: {
-            type: String,
-            required: true,
-        },
-        currentValue: {
-            type: [Object, String, Number, Boolean, null],
-            required: true,
-        },
-        items: {
-            type: Array,
-            required: true,
-            validator: (items) => {
-                // checking that we received an array of only DropdownItem instances with at least one item
-                if (Array.isArray(items) && items.length > 1) {
-                    return (
-                        items.filter((item) => item instanceof DropdownItem).length === items.length
-                    )
-                }
-                return false
-            },
-        },
-        withToggleButton: {
-            type: Boolean,
-            default: false,
-        },
-        disabled: {
-            type: Boolean,
-            default: false,
-        },
-        small: {
-            type: Boolean,
-            default: false,
-        },
-    },
-    emits: ['click', 'select:item'],
-    setup() {
-        useTippyTooltip('.dropdown-item[data-tippy-content]', { placement: 'left' })
-    },
-    data() {
-        return {
-            // generating a unique HTML ID for this dropdown
-            uniqueHtmlId: `dropdown-${randomIntBetween(0, 10000)}`,
-        }
-    },
-    watch: {
-        disabled(isDisabled) {
-            if (isDisabled) {
-                // hiding the dropdown body if component becomes disabled
-                this.$refs.dropdownMenu.classList.remove('show')
-            }
-        },
-    },
-    mounted() {
-        if (this.withToggleButton) {
-            this.dropdown = new Dropdown(this.$refs.dropdownToggleButton)
-        } else {
-            this.dropdown = new Dropdown(this.$refs.dropdownMainButton)
-        }
-    },
-    beforeUnmount() {
-        this.dropdown.dispose()
-        delete this.dropdown
-    },
-    methods: {
-        onMainButtonClick() {
-            if (this.withToggleButton) {
-                // letting the parent component handle what to do by sending an event
-                this.$emit('click')
-            }
-        },
-        selectItem(item) {
-            this.$emit('select:item', item)
-        },
-    },
-}
-</script>
-
 <style lang="scss" scoped>
 .dropdown-item {
     cursor: pointer;
diff --git a/src/utils/components/SimpleWindow.vue b/src/utils/components/SimpleWindow.vue
index 6866330e2..daf199bfb 100644
--- a/src/utils/components/SimpleWindow.vue
+++ b/src/utils/components/SimpleWindow.vue
@@ -42,6 +42,10 @@ const props = defineProps({
         type: Boolean,
         default: false,
     },
+    dataCy: {
+        type: String,
+        default: '',
+    },
 })
 const { title, hide } = toRefs(props)
 
@@ -85,6 +89,7 @@ onMounted(() => {
             v-show="!hide"
             ref="windowRef"
             class="simple-window card"
+            :data-cy="dataCy"
             :class="[
                 initialPositionClass,
                 {
@@ -104,7 +109,11 @@ onMounted(() => {
                 }}</span>
                 <span v-else class="me-auto" />
                 <PrintButton v-if="allowPrint && showBody" :content="contentRef"></PrintButton>
-                <button class="btn btn-light btn-sm me-2" @click.stop="showBody = !showBody">
+                <button
+                    class="btn btn-light btn-sm me-2"
+                    data-cy="simple-window-minimize"
+                    @click.stop="showBody = !showBody"
+                >
                     <FontAwesomeIcon :icon="`caret-${showBody ? 'up' : 'down'}`" />
                 </button>
                 <button
@@ -115,7 +124,12 @@ onMounted(() => {
                     <FontAwesomeIcon icon="times" />
                 </button>
             </div>
-            <div ref="contentRef" class="card-body" :class="{ hide: !showBody }">
+            <div
+                ref="contentRef"
+                class="card-body"
+                :class="{ hide: !showBody }"
+                data-cy="simple-window-body"
+            >
                 <slot />
             </div>
         </div>
diff --git a/tests/cypress/tests-e2e/feedbackTestUtils.js b/tests/cypress/tests-e2e/feedbackTestUtils.js
index 41f38fee2..8e43561a4 100644
--- a/tests/cypress/tests-e2e/feedbackTestUtils.js
+++ b/tests/cypress/tests-e2e/feedbackTestUtils.js
@@ -36,13 +36,21 @@ export function parseFormData(request) {
     )
 }
 
-export function interceptFeedback(success) {
+/**
+ * @param {Boolean} success
+ * @param {Object} [options]
+ * @param {Number} [options.delay] How long the delay before answering should last (in ms). Default
+ *   to 1 second.
+ * @param {String} [options.alias] How to name the intercept. Default to 'feedback'.
+ */
+export function interceptFeedback(success, options = {}) {
+    const { delay = 1000, alias = 'feedback' } = options
     cy.intercept('POST', '**/api/feedback', (req) => {
         req.reply({
             body: {
                 success,
             },
-            delay: 1000,
+            delay,
         })
-    }).as('feedback')
+    }).as(alias)
 }
diff --git a/tests/cypress/tests-e2e/reportProblem.cy.js b/tests/cypress/tests-e2e/reportProblem.cy.js
index 3406b6470..8a9de26ed 100644
--- a/tests/cypress/tests-e2e/reportProblem.cy.js
+++ b/tests/cypress/tests-e2e/reportProblem.cy.js
@@ -13,112 +13,150 @@ const validEmail = 'this.is.a.valid@email.com'
 
 describe('Testing the report problem form', () => {
     function closeForm() {
-        cy.get('[data-cy="window-close"]').should('be.visible').click()
+        cy.get('[data-cy="report-problem-window"] [data-cy="window-close"]:visible').click()
     }
 
     function openForm() {
-        cy.get('[data-cy="report-problem-button"]').should('be.visible').click()
-        cy.get('[data-cy="report-problem-form"]').should('be.visible')
+        cy.get('[data-cy="report-problem-button"]:visible').as('reportProblemButton').click()
+        cy.get('[data-cy="report-problem-form"]').as('reportProblemForm').should('be.visible')
     }
 
-    it('test the report problem form UI, validations, and it backend interaction', () => {
-        interceptFeedback(false)
+    it('places the "report a problem" correctly', () => {
         cy.goToMapView()
-        cy.get('[data-cy="menu-button"]').should('be.visible').click()
-        cy.get('[data-cy="menu-help-section"]').should('be.visible').click()
 
+        // Mobile view
+        cy.viewport(320, 568)
+        cy.openMenuIfMobile()
+        cy.get('[data-cy="menu-help-section"]:visible').click()
         cy.log('The button should be in the header as a link on mobile')
-        cy.get('[data-cy="report-problem-button"]').should('be.visible').click()
-        cy.get('[data-cy="report-problem-form"]').should('be.visible')
+        cy.get('[data-cy="report-problem-button"]:visible').click()
+        cy.get('[data-cy="report-problem-form"]').as('feedbackForm').should('be.visible')
+
+        cy.log('can minimize the window in order to see the map')
+        cy.get('[data-cy="report-problem-window"] [data-cy="simple-window-minimize"]:visible')
+            .as('minimizeButton')
+            .click()
+        cy.get('@feedbackForm').should('be.hidden')
+        cy.get('@minimizeButton').click()
+        cy.get('@feedbackForm').should('be.visible')
         closeForm()
+        cy.closeMenuIfMobile()
 
         cy.log('The button should be in the header as a link on desktop')
         cy.viewport(1920, 1080)
-        cy.get('[data-cy="report-problem-link-button"]').should('be.visible').click()
-        cy.get('[data-cy="report-problem-form"]').should('be.visible')
+        cy.get('[data-cy="report-problem-link-button"]:visible').click()
+        cy.get('@feedbackForm').should('be.visible')
+
+        cy.log('can minimize the window in order to see the map')
+        cy.get('@minimizeButton').click()
+        cy.get('@feedbackForm').should('be.hidden')
+        cy.get('@minimizeButton').click()
+        cy.get('@feedbackForm').should('be.visible')
         closeForm()
-
-        // Reset back to mobile view
-        cy.viewport(320, 568)
-
-        cy.log('It validates the report problem form properly')
+    })
+    it('test the report problem form UI, validations, and it backend interaction', () => {
+        interceptFeedback(false)
+        cy.goToMapView()
 
         cy.log('It is not possible to report a problem without a category')
         cy.openMenuIfMobile()
+        if (isMobile()) {
+            cy.get('[data-cy="menu-help-section"]:visible').click()
+        }
         openForm()
-        cy.get('[data-cy="dropdown-main-button"').should('contain.text', 'Select a category')
-        cy.get('[data-cy="text-area-input"]').type(text)
-        cy.get('[data-cy="email-input"]').type(validEmail)
-        cy.get('[data-cy="submit-button"]:visible').click()
-        cy.get('[data-cy="report-feedback-category-dropdown"]').should('have.class', 'is-invalid')
+        cy.get('[data-cy="report-problem-category"] [data-cy="dropdown-main-button"]')
+            .as('categoryDropdown')
+            .should('be.visible')
+            .should('contain.text', 'Select a category')
+
+        cy.get('[data-cy="report-problem-text-area"] [data-cy="text-area-input"]')
+            .as('textArea')
+            .should('be.visible')
+        cy.get('@textArea').type(text)
+
+        cy.get('[data-cy="report-problem-email"] [data-cy="email-input"]')
+            .as('emailInput')
+            .should('be.visible')
+        cy.get('@emailInput').type(validEmail)
+
+        cy.get('[data-cy="submit-button"]').as('submit').should('be.visible')
+        cy.get('@submit').click()
+
+        cy.get('[data-cy="report-problem-category"]').should('have.class', 'is-invalid')
         cy.get('[data-cy="report-problem-failed-text"]').should('not.exist')
         closeForm()
 
         cy.log('It is possible to report a problem without specifying an email address')
         cy.openMenuIfMobile()
         openForm()
-        cy.get('[data-cy="dropdown-main-button"').should('contain.text', 'Select a category')
-        cy.get('[data-cy="dropdown-main-button"]').should('be.visible').click()
-        cy.get('[data-cy="dropdown-item-feedback_category_other"]').should('be.visible').click()
-        cy.get('[data-cy="text-area-input"]').type(text)
-        cy.get('[data-cy="email-input"').should('be.empty')
-        cy.get('[data-cy="submit-button"]').should('be.enabled')
+        cy.get('@categoryDropdown').click()
+        cy.get('[data-cy="dropdown-item-other"]:visible').as('categoryOther').click()
+        cy.get('@textArea').type(text)
+        cy.get('@emailInput').should('be.empty')
+        cy.get('@submit').should('be.enabled')
         closeForm()
 
         cy.log('It is not possible to report a problem with a malformed email')
         cy.openMenuIfMobile()
         openForm()
-        cy.get('[data-cy="dropdown-main-button"]').should('be.visible').click()
-        cy.get('[data-cy="dropdown-item-feedback_category_other"]').should('be.visible').click()
-        cy.get('[data-cy="text-area-input"]').type(text)
-        cy.get('[data-cy="email-input"]').type('this.is.not.a.valid@email')
-        cy.get('[data-cy="submit-button"]:visible').click()
-        cy.get('[data-cy="email-input"]').should('have.class', 'is-invalid')
+        cy.get('@categoryDropdown').click()
+        cy.get('@categoryOther').click()
+        cy.get('@textArea').type(text)
+        cy.get('@emailInput').type('this.is.not.a.valid@email')
+        cy.get('@submit').click()
+        cy.get('@emailInput').should('have.class', 'is-invalid')
         cy.get('[data-cy="report-problem-failed-text"]').should('not.exist')
         closeForm()
 
         cy.log('It validates email before enabling the user to report a problem')
         cy.openMenuIfMobile()
         openForm()
-        cy.get('[data-cy="dropdown-main-button"]').should('be.visible').click()
-        cy.get('[data-cy="dropdown-item-feedback_category_other"]').should('be.visible').click()
-        cy.get('[data-cy="text-area-input"]').type(text)
-        cy.get('[data-cy="email-input"').type(validEmail)
-        cy.get('[data-cy="submit-button"]').should('be.enabled')
+        cy.get('@categoryDropdown').click()
+        cy.get('[data-cy="dropdown-item-background_map"]:visible')
+            .as('categoryBackgroundMap')
+            .click()
+        cy.get('@textArea').type(text)
+        cy.get('@emailInput').type(validEmail)
+        cy.get('@submit').should('be.enabled')
         closeForm()
 
         cy.log('It is not possible to report a problem without filling the message')
         cy.openMenuIfMobile()
         openForm()
-        cy.get('[data-cy="dropdown-main-button"]').should('be.visible').click()
-        cy.get('[data-cy="dropdown-item-feedback_category_other"]').should('be.visible').click()
-        cy.get('[data-cy="text-area-input"]').should('be.empty')
-        cy.get('[data-cy="email-input"]').type(validEmail)
-        cy.get('[data-cy="submit-button"]:visible').click()
-        cy.get('[data-cy="email-input"]').should('have.class', 'is-valid')
-        cy.get('[data-cy="text-area-input"]').should('have.class', 'is-invalid')
+        cy.get('@categoryDropdown').click()
+        cy.get('@categoryOther').click()
+        cy.get('@textArea').should('be.empty')
+        cy.get('@emailInput').type(validEmail)
+        cy.get('@submit').click()
+        cy.get('@emailInput').should('have.class', 'is-valid')
+        cy.get('@textArea').should('have.class', 'is-invalid')
         cy.get('[data-cy="report-problem-failed-text"]').should('not.exist')
         closeForm()
 
         cy.log('It generates a complete request to service-feedback')
         cy.openMenuIfMobile()
         openForm()
-        interceptFeedback(true)
-        cy.get('[data-cy="dropdown-main-button"]').should('be.visible').click()
-        cy.get('[data-cy="dropdown-item-feedback_category_other"]').should('be.visible').click()
-        cy.get('[data-cy="email-input"]').type(validEmail)
-        cy.get('[data-cy="text-area-input"]').type(text)
-        cy.get('[data-cy="submit-button"]').scrollIntoView()
-        cy.get('[data-cy="submit-button"]').click()
+        interceptFeedback(true, {
+            // waiting a bit longer to ensure we get to catch the pending icon while testing
+            delay: 3000,
+            alias: 'longAnswer',
+        })
+        cy.get('@categoryDropdown').click()
+        cy.get('[data-cy="dropdown-item-thematic_map"]:visible').click()
+        cy.get('@emailInput').type(validEmail)
+        cy.get('@textArea').type(text)
+        cy.get('@submit').scrollIntoView()
+        cy.get('@submit').click()
 
         cy.log(
             'it shows the user the feedback was well received with a checkmark in the submit button'
         )
         cy.get('[data-cy="submit-button"] [data-cy="submit-pending-icon"]').should('be.visible')
-        cy.wait('@feedback').then((interception) => {
+        cy.wait('@longAnswer').then((interception) => {
             ;[
                 { name: 'subject', contains: `[Problem Report]` },
                 { name: 'feedback', contains: text },
+                { name: 'category', contains: 'thematic_map' },
                 { name: 'version', contains: APP_VERSION },
                 { name: 'ua', contains: navigator.userAgent },
                 { name: 'email', contains: validEmail },
@@ -130,27 +168,30 @@ describe('Testing the report problem form', () => {
             })
         })
 
-        cy.get('[data-cy="report-problem-form"]').should('not.exist')
+        cy.get('@reportProblemForm').should('not.exist')
         cy.get('[data-cy="report-problem-success-text"]').should('be.visible')
-        cy.get('[data-cy="report-problem-close-successful"]').should('be.focused')
+        cy.get('[data-cy="report-problem-close-successful"]')
+            .as('closeSuccessButton')
+            .should('be.focused')
 
         cy.log('Closes the modal if the close button is clicked')
-        cy.get('[data-cy="report-problem-close-successful"]').click()
+        cy.get('@closeSuccessButton').click()
         cy.get('[data-cy="report-problem-form"]').should('not.exist')
         // Form is already closed at this point
 
         cy.log('It send the correct version when the email is empty and attach a file')
+        interceptFeedback(true)
         cy.openMenuIfMobile()
         openForm()
-        cy.get('[data-cy="dropdown-main-button"]').should('be.visible').click()
-        cy.get('[data-cy="dropdown-item-feedback_category_other"]').should('be.visible').click()
-        cy.get('[data-cy="text-area-input"]').type(text)
+        cy.get('@categoryDropdown').should('be.visible').click()
+        cy.get('[data-cy="dropdown-item-other"]').should('be.visible').click()
+        cy.get('@textArea').type(text)
         const localKmlFile = 'import-tool/external-kml-file.kml'
         cy.fixture(localKmlFile, null).as('kmlFixture')
         cy.get('[data-cy="file-input"]').selectFile('@kmlFixture', {
             force: true,
         })
-        cy.get('[data-cy="submit-button"]').click()
+        cy.get('@submit').click()
         cy.get('[data-cy="file-input-text"]').should('have.class', 'is-valid')
 
         cy.wait('@feedback').then((interception) => {
@@ -158,6 +199,7 @@ describe('Testing the report problem form', () => {
             ;[
                 { name: 'subject', contains: `[Problem Report]` },
                 { name: 'feedback', contains: text },
+                { name: 'category', contains: 'other' },
                 { name: 'version', contains: APP_VERSION },
                 { name: 'ua', contains: navigator.userAgent },
             ].forEach((param) => {
@@ -183,11 +225,11 @@ describe('Testing the report problem form', () => {
         cy.openMenuIfMobile()
         openForm()
         interceptFeedback(false)
-        cy.get('[data-cy="dropdown-main-button"]').should('be.visible').click()
-        cy.get('[data-cy="dropdown-item-feedback_category_other"]').should('be.visible').click()
-        cy.get('[data-cy="text-area-input"]').type(text)
-        cy.get('[data-cy="email-input"]').type(validEmail)
-        cy.get('[data-cy="submit-button"]').click()
+        cy.get('@categoryDropdown').should('be.visible').click()
+        cy.get('[data-cy="dropdown-item-other"]').should('be.visible').click()
+        cy.get('@textArea').type(text)
+        cy.get('@emailInput').type(validEmail)
+        cy.get('@submit').click()
 
         cy.wait('@feedback')
         cy.get('[data-cy="submit-button"] [data-cy="report-problem-success-icon"]').should(
@@ -199,28 +241,39 @@ describe('Testing the report problem form', () => {
     it('reports a problem with drawing attachment', () => {
         cy.goToMapView()
         interceptFeedback(true)
+        cy.openMenuIfMobile()
         if (isMobile()) {
-            cy.get('[data-cy="menu-button"]').should('be.visible').click()
-            cy.get('[data-cy="menu-help-section"]').should('be.visible').click()
+            cy.get('[data-cy="menu-help-section"]:visible').click()
         }
 
         cy.get('[data-cy="report-problem-button"]').should('be.visible').click()
-        cy.get('[data-cy="report-problem-form"]').should('be.visible')
+        cy.get('[data-cy="report-problem-form"]').as('reportForm').should('be.visible')
 
         cy.log('Select category')
-        cy.get('[data-cy="dropdown-main-button"]').should('be.visible').click()
-        cy.get('[data-cy="dropdown-item-feedback_category_other"]').should('be.visible').click()
+        cy.get('[data-cy="report-problem-category"] [data-cy="dropdown-main-button"]')
+            .as('categoryDropdown')
+            .should('be.visible')
+        cy.get('@categoryDropdown').click()
+        cy.get('[data-cy="dropdown-item-other"]:visible').click()
 
         cy.log('Write description and email')
-        cy.get('[data-cy="text-area-input"]').type(text)
-        cy.get('[data-cy="email-input"]').type(validEmail)
+        cy.get('[data-cy="report-problem-text-area"] [data-cy="text-area-input"]')
+            .as('textArea')
+            .should('be.visible')
+        cy.get('@textArea').type(text)
+
+        cy.get('[data-cy="report-problem-email"] [data-cy="email-input"]')
+            .as('emailInput')
+            .should('be.visible')
+        cy.get('@emailInput').type(validEmail)
 
         cy.log('Enter the drawing mode')
         cy.viewport('macbook-11')
-        cy.get('[data-cy="report-problem-drawing-button"]').should('be.visible').click()
-        cy.get('[data-cy="report-problem-form"]').should('not.be.visible')
-        // we need to increase the timeout here below because upon opening the drawing mode for the
-        // first time in e2e tests, the loading of the library can takes time
+        cy.get('[data-cy="report-problem-drawing-button"]').as('reportDrawing').should('be.visible')
+        cy.get('@reportDrawing').click()
+        cy.get('@reportForm').should('not.be.visible')
+        // we need to increase the timeout here below because, upon opening the drawing mode for the
+        // first time in e2e tests, the loading of the library can take time
         cy.get('[data-cy="drawing-header-title"]', { timeout: 15000 })
             .should('be.visible')
             .contains('3. Indicate the appropriate location on the map :')
@@ -241,30 +294,32 @@ describe('Testing the report problem form', () => {
         cy.log(`Exit drawing mode`)
         cy.get('[data-cy="drawing-header-close-button"]').should('be.visible').click()
         cy.get('[data-cy="drawing-share-admin-close"]').click()
-        cy.get('[data-cy="report-problem-form"]').should('be.visible')
+        cy.get('@reportForm').should('be.visible')
         cy.get('[data-cy="drawing-header-title"]').should('not.exist')
-        cy.get('[data-cy="text-area-input"]').should('be.visible').should('have.value', text)
-        cy.get('[data-cy="email-input"]').should('be.visible').should('have.value', validEmail)
+        cy.get('@textArea').should('be.visible').should('have.value', text)
+        cy.get('@emailInput').should('be.visible').should('have.value', validEmail)
         cy.get('[data-cy="report-problem-drawing-added-feedback"]')
             .should('be.visible')
             .should('have.class', 'valid-feedback')
 
         cy.log('Clear drawing')
-        cy.get('[data-cy="report-problem-drawing-button"]').should('be.visible').click()
-        cy.get('[data-cy="drawing-toolbox-delete-button"]').should('be.visible').click()
-        cy.get('[data-cy="modal-confirm-button"]').should('be.visible').click()
-        cy.get('[data-cy="drawing-header-close-button"]').should('be.visible').click()
+        cy.get('@reportDrawing').should('be.visible')
+        cy.get('@reportDrawing').click()
+        cy.get('[data-cy="drawing-toolbox-delete-button"]:visible').click()
+        cy.get('[data-cy="modal-confirm-button"]:visible').click()
+        cy.get('[data-cy="drawing-header-close-button"]:visible').click()
         cy.viewport('iphone-3')
 
-        cy.get('[data-cy="report-feedback-category-dropdown"]').should('be.visible')
+        cy.get('[data-cy="report-problem-category"]').should('be.visible')
         cy.get('[data-cy="drawing-header-title"]').should('not.exist')
-        cy.get('[data-cy="text-area-input"]').should('have.value', text)
-        cy.get('[data-cy="email-input"]').should('have.value', validEmail)
+        cy.get('@textArea').should('have.value', text)
+        cy.get('@emailInput').should('have.value', validEmail)
         cy.get('[data-cy="report-problem-drawing-added-feedback"]').should('not.be.visible')
 
         cy.log('Draw some more features')
-        cy.get('[data-cy="report-problem-drawing-button"]').scrollIntoView()
-        cy.get('[data-cy="report-problem-drawing-button"]').should('be.visible').click()
+        cy.get('@reportDrawing').scrollIntoView()
+        cy.get('@reportDrawing').should('be.visible')
+        cy.get('@reportDrawing').click()
         cy.clickDrawingTool(EditableFeatureTypes.MARKER)
         cy.get('[data-cy="ol-map"]').click()
 
@@ -286,15 +341,16 @@ describe('Testing the report problem form', () => {
 
         cy.get('[data-cy="drawing-toolbox-close-button"]').should('be.visible').click()
         cy.get('[data-cy="drawing-share-admin-close"]').should('be.visible').click()
-        cy.get('[data-cy="dropdown-main-button"]').scrollIntoView()
-        cy.get('[data-cy="report-problem-form"]').should('be.visible')
+        cy.get('@categoryDropdown').scrollIntoView()
+        cy.get('@reportForm').should('be.visible')
         cy.get('[data-cy="drawing-header-title"]').should('not.exist')
-        cy.get('[data-cy="text-area-input"]').should('have.value', text)
-        cy.get('[data-cy="email-input"]').should('have.value', validEmail)
+        cy.get('@textArea').should('have.value', text)
+        cy.get('@emailInput').should('have.value', validEmail)
         cy.get('[data-cy="report-problem-drawing-added-feedback"]')
+            .as('reportDrawingFeedback')
             .should('be.visible')
             .should('have.class', 'valid-feedback')
-            .contains('Drawing added as attachment')
+        cy.get('@reportDrawingFeedback').contains('Drawing added as attachment')
 
         cy.log('Send the feedback')
         cy.get('[data-cy="submit-button"]').click()