Skip to content

Latest commit

 

History

History
211 lines (145 loc) · 10.3 KB

README.ru.md

File metadata and controls

211 lines (145 loc) · 10.3 KB

Библиотека BEM Core

bem-core — это библиотека с открытым кодом, которая предоставляет набор блоков для разработки веб-интерфейсов. Содержит необходимый минимум для разработки клиентского JS и HTML-шаблонов.

Build Status GitHub Release devDependency Status

Примечание. Информация о библиотеке в более информативном виде доступна на bem.info. This README is also available in English.

Содержание

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

Уровни переопределения

  • common.blocks — поддержка всех устройств и браузеров;
  • desktop.blocks — поддержка всех десктопных браузеров;
  • touch.blocks — реализация специфических особенностей для touch-платформ.

Блоки

  • i-bem — базовый блок с хелперами для JS и HTML;
  • i-bem-dom — базовый блок с хелперами для HTML;
  • strings — хелперы для JS-строк;
  • objects — хелперы для JS-объектов;
  • functions — хелперы для JS-функций;
  • events — JS-события;
  • querystring — работа со строкой запроса;
  • tick — глобальный таймер;
  • idle — IDLE-событие;
  • next-tick — полифил для nextTick/setTimeout(0, ...);
  • inherit — ООП-хелперы;
  • jquery — jQuery;
  • clearfix — CSS-трюк clearfix;
  • identify — идентификация JS-объектов;
  • cookie — хелперы для работы с браузерными куками;
  • vow — реализация Promises/A+;
  • dom — хелперы для работы с DOM;
  • loader — загрузчик для JS-файлов;
  • ua — определение возможностей браузера;
  • uri — декодирование строки из формата URI;
  • keyboard — хелперы для работы с клавиатурой;
  • page — скелет для html/head/body.

Использование

Наиболее простым способом начать проект с использованием bem-core является project-stub.

Поддерживаемые браузеры

Мы поддерживаем браузеры на основе статистики, получаемой на сервисах Яндекса.

Браузеры с долей:

  • более 2% пользователей — полная совместимость.
  • более 0.5% — частичная совместимость (означает, что данные будут доступны, но возможна деградация).
  • менее 0.5% — не поддерживаются.

Desktop

Полная совместимость

  • Google Chrome 29+;
  • Firefox 24+;
  • Yandex 1.7+;
  • Opera 12.16;
  • MSIE 10.0;
  • MSIE 9.0;
  • MSIE 8.0;
  • Opera 12.15.

Частичная совместимость

  • Opera 17.0;
  • Opera 16.0;
  • Opera 12.14;
  • Opera 12.2;
  • Firefox 23.

Touch

Полная совместимость

  • iOS 6+;
  • Android 2.3+;
  • Opera Mobile 12+;
  • Windows Phone 7+.

Частичная совместимость

  • iOS 5;
  • Android 2.2.

Технологии

  • vanilla.js + browser.js;
  • DEPS;
  • bemhtml;
  • bemtree.

API

Автосгенерированную документацию на JavaScript API блоков (JSDoc) можно посмотреть на bem.info. Например, для блока i-bem она доступна по ссылке https://ru.bem.info/platform/libs/bem-core/current/desktop/i-bem/#jsdoc

Разработка

Рабочая копия

  1. Получаем исходники нужной версии (например, v4):

    $ git clone -b v4 git://github.com/bem/bem-core.git
$ cd bem-core

  2. Устанавливаем зависимости:

    $ npm install

    Для последующего запуска локально установленных npm-зависимостей нам потребуется export PATH=./node_modules/.bin:$PATH или любой альтернативный способ.

  3. Устанавливаем зависимые библиотеки:

    $ npm run deps

  4. Собираем примеры и тесты:

    $ npm test

  5. Запускаем разработческий сервер:

    $ npm start

Модульное тестирование

Сборка дефолтного тестового бандла для functions__debounce:

$ magic make desktop.specs/functions__debounce

После сборки тестового бандла вы увидите результаты выполнения тестов в консоли. Их также можно посмотреть в браузере, открыв desktop.specs/functions__debounce/spec-js+browser-js+bemhtml/spec-js+browser-js+bemhtml.html.

По аналогии можно запустить тесты для других БЭМ-сущностей, имеющих реализацию в технологии spec.js.

Покрытие кода тестами

Чтобы собрать статистику покрытия кода тестами, необходимо добавить переменную окружения ISTANBUL_COVERAGE=yes в сборке тестового бандла:

$ ISTANBUL_COVERAGE=yes magic make desktop.specs && istanbul report html

Сбор статистики покрытия тестами так же работает для запуска тестов конкретной БЭМ-сущности.

Пример для functions__debounce:

$ ISTANBUL_COVERAGE=yes magic make desktop.specs/functions__debounce && istanbul report html

После завершения выполнения тестов, можно посмотреть отчет о покрытии кода тестами, открыв в браузере страницу coverage/index.html.

Полный отчет и статистику покрытия кода библиотеки тестами можно посмотреть на странице профиля bem-core в проекте Coveralls.

Для сборки и запуска тестов используется библиотека enb-bem-specs. См. подробную информацию про инфраструктуру тестирования.

Команда основной разработки

Рабочий процесс

Список текущих задач отображается на специальном Agile Board.

Статусы задач:

  • backlog — неразобранные задачи, которые требуют обсуждения командой для оценки и принятия решения о реализации. В таком статусе также могут находиться задачи, по которым нужна дополнительная информация.
  • ready — разобранные задачи, решение о реализации которых принято.
  • in progress — задачи с конкретным исполнителем, которые находятся в работе.
  • done — задачи, закрытые за последние семь дней (это временное техническое ограничение выбранного Agile Board).

Лицензия

© 2012 YANDEX LLC. Код лицензирован Mozilla Public License 2.0.