Нам нужны твои мозги

Хотите расти как разработчик и найти крутую работу? Не протирайте штаны — займитесь Open Source проектами. Так легче всего попасть в лучшие команды разработчиков и положить себе в резюме настоящий проект, вместо нелепых «примеров кода». Но найти подходящий проект для участия сложно. Начинаются лень и отговорки, а за ними — отсутствие профессионального роста, критики по-настоящему крутых программистов, уныние и застой.

На Cult of Martians мы собираем интересные задачи для современных веб-программистов. Можно выбрать подходящую по сложности, продолжительности и специализации. Задачи не выдуманы «из воздуха» — каждая решает насущную проблему, и решить ее можно через создание нового Open Source проекта или улучшение существующего. Решайте задачи, прокачивайтесь, присылайте решение на оценку. Лучших могут пригласить к себе на работу компании, программистам которых понравится ваше решение.

В работе 0Короткие 0Длинные 0Сделано 229
Помощь запрашивал
Андрей Ситник
 Андрей Ситник
Помог
Владислав Бракало
 Владислав Бракало

Фронт: Добавить поиск элемента в KeyUX

Для новичков, задача на пару дней

KeyUX добавляет на сайт обработку событий с клавиатуры, чтобы пользоваться сайтом с клавиатуры было удобнее.

Например, он добавляет для списков с role="menu" (табы, меню навигации) навигацию стрелочками. Так вместо огромного списка для Tab-навигации у нас получается такие изолированные блоки — между которыми мы перемещаемся Tab-ом, а внутри стрелочками.

Но сейчас у нас нет одной удобной функции, которая требуется для role="menu".

Нужно чтобы, когда пользователь начал вводить первые буквы элемента списка, фокус переместился на этот элемент. Примерно, как работает <select> или Ariakit.

Польза: строка в резюме, которая показывает знание технологий доступности.

  1. Форкнуть репозиторий.
  2. Поискать какую обычно делают задержку между нажатиями клавиш, чтобы считать их цельной последовательностью, а не разными поисками.
  3. Добавить в menu.js поиск по мере ввода название. Не забыть, что, если между нажатиями букв небольшая задержка, нужно искать по всей введённой последовательности.
  4. Добавить в test/menu.test.ts тесты.
  5. Игнорировать горячие клавиши если фокус стоит на menuitem в hotkey.js.
  6. Добавить в test/hotkey.test.ts тесты.
  7. Запустить pnpm size-limit и обновить размер в size-limit в package.json.
  8. Проверить, что всё правильно работает, запустив демо-сервер — pnpm start.
  9. Отправить PR.
Посмотреть решение