bem-core library
Documentation on bem-core
in a much more informative way is also available at bem.info. It is also available in Russian.
What is this?
bem-core
is a base library for web interface development.
It provides the minimal stack for coding client-side JavaScript and templating.
Use
The easiest way to run a project with bem-core
is to use
the project-stub.
You can use any other way you are familiar with to include the library into the project.
Inside
Levels
common.blocks
β suited for any devices and browsersdesktop.blocks
β should be used for desktop browserstouch.blocks
β implement some touch-platforms specifics
Blocks
i-bem
β base block with helpers for JS and HTMLstrings
β helpers for JS-stringsobjects
β helpers for JS-objectsfunctions
β helpers for JS-functionsevents
β JS-eventsquerystring
β helpers for work with querystringtick
β global timeridle
β IDLE eventnext-tick
β polyfill fornextTick
/setTimeout(0, ...)
inherit
β OOP helpersjquery
β jQueryclearfix
β CSS clearfix trickidentify
β identify JS-objectscookie
β helpers for work with browser cookiesvow
β Promises/A+ implementationdom
β helpers for work with DOMloader
β loader for JS filesua
β browser features detectionkeyboard
β keyboard helperspage
β html/head/body scaffold
Technologies
- vanilla.js + browser.js
- bemhtml
- bemtree
API
The autogenerated JSDoc API can be found on bem.info. E.g. JSDoc for i-bem
is here https://en.bem.info/platform/libs/bem-core/current/desktop/i-bem/#jsdoc
Changelog
You can check the changelog at the Changelog page.
Migration
If you used BEM before, check the migration instructions.
Development
Working copy
-
Get the needed version code (e.g.,
v4
):$ git clone -b v4 git://github.com/bem/bem-core.git $ cd bem-core
-
Install the dependencies:
$ npm install
You need
export PATH=./node_modules/.bin:$PATH
or an alternative way to run locally-installednpm
dependencies. -
Install all necessary libraries:
$ npm run deps
-
Build and run tests (specs):
$ npm test
-
Run development server:
$ npm start
How to contribute
Please refer to How to contribute guide.
Modular testing
A default test bundle for functions__debounce
:
$ magic make desktop.specs/functions__debounce
You can see the results of the tests in the terminal after the building process finishes.
You can also watch them in a browser loading desktop.specs/functions__debounce/spec-js+browser-js+bemhtml/spec-js+browser-js+bemhtml.html
.
Run tests for other BEM entities in the same way. This will work for those which are equipped with .spec.js
file.
Code coverage
To build code coverage report add ISTANBUL_COVERAGE=yes
environment variable to the tests run command:
$ ISTANBUL_COVERAGE=yes magic make desktop.specs && istanbul report html
You can run modular testing with coverage as well by using more concrete build target as was described above.
$ ISTANBUL_COVERAGE=yes magic make desktop.specs/functions__debounce && istanbul report html
After tests finish, you can view coverage HTML report by opening coverage/index.html
in your favorite
browser.
The whole code coverage statistics can be found on the bem-core profile page on Coveralls.
Tests are built with a enb-bem-specs library. Check the details (available in Russian only).
Supported browsers
Our browser support policy is based on statistics we get from Yandex services.
Browsers with more than 2% users get full compliant support, more than 0.5% β partially compliant (which means that data is accessible but not necessary 100% functional). New features testing is not provided by us forΒ Β browsers with less than 0.5% users.
Desktop
Fully compliant
- Google Chrome 29+
- Firefox 24+
- Yandex 1.7+
- Opera 12.16
- MSIE 10.0
- MSIE 9.0
- MSIE 8.0
- Opera 12.15
Partially compliant
- Opera 17.0
- Opera 16.0
- Opera 12.14
- Opera 12.2
- Firefox 23
Touch
Fully compliant
- iOS 6+
- Android 2.3+
- Opera Mobile 12+
- Windows Phone 7+
Partially compliant
- iOS 5
- Android 2.2
License
Code and documentation copyright 2012 YANDEX LLC. Code released under the Mozilla Public License 2.0.