fix(Touch): fix using mouse with touch device

[EldarMuhamethanov]

• close [Bug][Touch]: при использовании блютуз мыши на планшете не работает взаимодействие #8882

---

• Unit-тесты
• Release notes

Описание

Сейчас есть проблема, что компонент Touch может обрабатывать либо touch-events(если они поддерживаются), либо mouse-events. Проблема заключается в том, что если , например на планшете попытаться воспользоваться блютуз мышью, она работать не будет. Это происходит потому что мышь тригерит mouse-events, а мы слушаем touch-events. Нужно доработать механизм подписки на события так, чтобы это работало.

Варианты решения

Использовать pointer-events.

Плюсы:

• Для всех устройств будет общий механизм.

Минусы:

• Браузерная поддержка не даст использовать pointer-events всегда
• Для того, чтобы отключать браузерную прокрутку на touch-устройствах, нужно навешивать touch-action: none, так где нужно. Это breaking-change

Слушать mouse-events и touch-events в зависимости от того mousedown или touchstart сработал

Плюсы:

• Изменение не ломающее обратную совместимость

Минусы:

• на некоторых устройствах touchstart генерирует еще и событие mousedown для совместимости со старыми браузерами. Поэтому нужно сделать механизм, который будет игнорировать такое событие mousedown, чтобы не было дублирования срабатываний

Изменения

Было решено использовать второй вариант решения проблемы. Для этого сделал следующее:

• Теперь на touch устройствах подписка происходит и на mousedown и touchstart
• Добавлена проверка на то, создан ли gesture. Эта проверка нужна чтобы не дублировать вызов колбеков, когда после touchstart срабатывает mousedown

Release notes

Исправления

• Touch: Исправлена проблема использования компонента Touch на планшетах с подключенной блютуз мышью

[github-actions]

size-limit report 📦

Path	Size
JS	409.79 KB (+0.02% 🔺)
JS (gzip)	124.17 KB (+0.02% 🔺)
JS (brotli)	102.01 KB (-0.07% 🔽)
JS import Div (tree shaking)	1.55 KB (0%)
CSS	351.65 KB (0%)
CSS (gzip)	43.59 KB (0%)
CSS (brotli)	34.76 KB (0%)

[github-actions]

e2e tests

Playwright Report

[github-actions]

👀 Docs deployed

• ✅ Styleguide
• ✅ Storybook
• ✅ Docs beta

📦 Package ✅

yarn add @vkontakte/vkui@https://vkui-screenshot.hb.bizmrg.com/pull/8883/30e195e3aafd298db17ff81a378585a7af471522/pkg/@vkontakte/vkui/_pkg.tgz

Commit 30e195e

[codecov]

Codecov Report

❌ Patch coverage is 87.50000% with 1 line in your changes missing coverage. Please review.
✅ Project coverage is 96.02%. Comparing base (b5fe8ca) to head (30e195e).
⚠️ Report is 1 commits behind head on master.

Files with missing lines	Patch %	Lines
packages/vkui/src/components/Touch/Touch.tsx	87.50%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #8883      +/-   ##
==========================================
- Coverage   96.03%   96.02%   -0.01%     
==========================================
  Files         428      428              
  Lines       12472    12476       +4     
  Branches     4113     4114       +1     
==========================================
+ Hits        11977    11980       +3     
- Misses        495      496       +1     

Flag	Coverage Δ
unittests	96.02% <87.50%> (-0.01%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[inomdzhon]

Откоментил как можно сделать иначе

[github-actions]

📊 Найдены изменения в собранных файлах: Отчет

Commit 30e195e

[BlackySoul]

Описание задачи теперь как-то не соответствует реализации 🤔