Кнопки в zoom-control триггерят сабмит формы

[projct1]

Версия библиотеки

2.0.1

Как воспроизвести

<script setup>
import { shallowRef } from 'vue'
import {
    YandexMap,
    YandexMapControls,
    YandexMapDefaultSchemeLayer,
    YandexMapScaleControl,
    YandexMapZoomControl
} from 'vue-yandex-maps'

const map = shallowRef(null)

const mapSettings = {
    theme: 'dark',
    strictMode: true,
    readonlySettings: true,
    location: {
        zoom: 10,
        center: [37.617698, 55.755864]
    }
}
</script>

<template>
    <form @submit.prevent>
        <input type="text">
        <!-- some of input fields -->
        <yandex-map v-model="map" height="320px" :settings="mapSettings">
            <yandex-map-default-scheme-layer/>
            <yandex-map-controls :settings="{ position: 'top left' }">
                <yandex-map-zoom-control/>
                <yandex-map-scale-control/>
            </yandex-map-controls>
        </yandex-map>
    </form>
</template>

Опишите проблему

Если инициализировать карту внутри формы, то при попытке увеличить или уменьшить масштаб, срабатывает сабмит формы. Либо если попытаться засабмитить форму другим способом, не трогая карту, то её масштаб уменьшается сам по себе. Это происходит, скорее всего, потому, что кнопки элементов управления масштабом не имеют атрибут type со значением button. По умолчанию у button стоит type=submit.

Дополнительная информация

Видео: https://skrinshoter.ru/vOgyO0lO14l

Активирую поле формы и нажимаю enter, для сабмита. И наоборот, нажимаю кнопки управления зумом, для сабмита формы :P Если же вынести карту за форму, то такого не происходит.

Ответы на вопросы

• [X] Я использую версию 2.x
• [X] Я поискал похожие ошибки и не нашел таковых

[daniluk4000]

И действительно. Также передал Яндексу.

Ваши варианты пока что такие:

1. Вынесите Карту из формы, если это возможно. Если вам нужно триггерить сабмит из формы, вы можете повесить на нужный элемент form="myform"
2. Предотвратите клик, закинув вот это на <yandex-map>: @click="(e) => (e.target.classList.contains('ymaps3x0--button') || e.target.closest('.ymaps3x0--button')) && e.preventDefault()"

Этот костыль я только что написал, выглядит немного уродливо, вам по хорошему это надо вынести в функцию. И тут скорее всего на типы будет ругаться.

Костыль внедрю в следующей версии Карт. Будем надеяться, что Яндекс это исправит на своей стороне, и в будущем я его уберу.

[projct1]

И действительно. Также передал Яндексу.

да, спасибо, я тоже им скидываю на почту эти несуразные баги)

[vermorag]

Вставлю свои пять копеек.

[projct1]

Мда, надеюсь добавление атттрибута type="button" ко всем кнопкам c тегом button не займёт у них год...

[vermorag]

Я плюнул и сам эти кнопки сделал. Зум и геолокацию.

[daniluk4000]

Я плюнул и сам эти кнопки сделал. Зум и геолокацию.

Ну я выше костыль кинул, и в след версии добавлю его в билд

[daniluk4000]

Ничего себе!

[daniluk4000]

Переоткрыл, чтобы выпилить костыль