Skip to content

Commit 7739675

Browse files
eGavreGavr
committed
Merge pull request #77 from bem/update-fix-readme
Update fix readme
2 parents 526c779 + b286b90 commit 7739675

3 files changed

Lines changed: 86 additions & 44 deletions

File tree

‎README.md‎

Lines changed: 43 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -4,37 +4,58 @@
44

55
## The comparison algorithm
66

7-
`html-differ` compares `HTML` codes using the following criteria:
7+
`HTML` codes are compared as **browsers** do, to be more exact `html-differ` compares `HTML` codes using the following criteria:
88

9-
1. Two respective lists of attributes are considered to be equivalent even if they are specified in different order.
10-
2. Two respective attributes `class` are considered to be equivalent if they refer to the same groups of `CSS` styles.
9+
* Two respective lists of attributes are considered to be equivalent even if they are specified in different order.
1110

1211
For example, the following two code samples will be considered to be equivalent:
1312

1413
```html
15-
<html>
16-
<head>
17-
<title>Test</title>
18-
</head>
19-
<body>
20-
<label>label for input</label>
21-
<input id="random" class="ab bc cd" tabIndex="1">
22-
</body>
23-
</html>
14+
<span id="blah" class="ololo" tabIndex="1">Text</span>
2415
```
2516

2617
```html
27-
<html>
28-
<head>
29-
<title>Test</title>
30-
</head>
31-
<body>
32-
<label>label for input</label>
33-
<input class=" cd ab bc" tabIndex="1" id="random">
34-
</body>
35-
</html>
18+
<span tabIndex="1" id="blah" class="ololo">Text</span>
19+
```
20+
21+
* Two respective attributes `class` are considered to be equivalent if they refer to the same groups of `CSS` styles.
22+
23+
For example, the following two code samples will be considered to be equivalent:
24+
25+
```html
26+
<span class="ab bc cd">Text</span>
27+
```
28+
29+
```html
30+
<span class=" cd ab bc">Text</span>
3631
```
3732

33+
* From the list of the same tag's attributes, the attrubute which goes the first will be taken for comparison, others will be ignored.
34+
35+
For example, the following two code samples will be considered to be equivalent:
36+
37+
```html
38+
<span id="blah" id="ololo">Text</span>
39+
```
40+
41+
```html
42+
<span id="blah">Text</span>
43+
```
44+
45+
* Closing tags are not compared.
46+
47+
For example, the following two code samples will be considered to be equivalent:
48+
49+
```html
50+
<span>Text</span>
51+
```
52+
53+
```html
54+
<span>Text</spane>
55+
```
56+
57+
**CAUTION!** `html-differ` does not check the validity of `HTML` codes, but compares them using the above shown criteria and specified options (see the list of possible options in the [usage](https://github.com/bem/html-differ#usage)).
58+
3859
## Install
3960

4061
```bash
@@ -222,7 +243,7 @@ Sets predefined options for `BEM` (default: `false`).
222243

223244
```bash
224245
$ html-differ --help
225-
Compares two HTML files
246+
Compares two HTML codes
226247

227248
Usage:
228249
html-differ [OPTIONS] [ARGS]

‎README.ru.md‎

Lines changed: 42 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -4,37 +4,58 @@
44

55
## Алгоритм сравнения
66

7-
`html-differ` сравнивает `HTML`-коды по следующим критериям:
7+
`HTML` коды сравниваются так, как это делают **браузеры**, то есть `html-differ` сравнивает `HTML`-коды по следующим критериям:
88

9-
1. Два соответствующих списка атрибутов считаются эквивалентными, даже если они записаны в разном порядке.
10-
2. Два соответствующих атрибута `class` считаются эквивалентными, если они ссылаются на одни и те же группы `CSS`-стилей.
9+
* Два соответствующих списка атрибутов считаются эквивалентными, даже если они записаны в разном порядке.
1110

1211
Например, cледующие два кода будут считаться эквивалентными:
1312

1413
```html
15-
<html>
16-
<head>
17-
<title>Test</title>
18-
</head>
19-
<body>
20-
<label>label for input</label>
21-
<input id="random" class="ab bc cd" tabIndex="1">
22-
</body>
23-
</html>
14+
<span id="blah" class="ololo" tabIndex="1">Text</span>
2415
```
2516

2617
```html
27-
<html>
28-
<head>
29-
<title>Test</title>
30-
</head>
31-
<body>
32-
<label>label for input</label>
33-
<input class=" cd ab bc" tabIndex="1" id="random">
34-
</body>
35-
</html>
18+
<span tabIndex="1" id="blah" class="ololo">Text</span>
19+
```
20+
21+
* Два соответствующих атрибута `class` считаются эквивалентными, если они ссылаются на одни и те же группы `CSS`-стилей.
22+
23+
Например, cледующие два кода будут считаться эквивалентными:
24+
25+
```html
26+
<span class="ab bc cd">Text</span>
27+
```
28+
29+
```html
30+
<span class=" cd ab bc">Text</span>
3631
```
3732

33+
* Из списка одинаковых атрибутов тэга, для сравнения будет взят тот, который идет первым, остальные будут проигнорированы.
34+
35+
Например, cледующие два кода будут считаться эквивалентными:
36+
37+
```html
38+
<span class="ab bc cd">Text</span>
39+
```
40+
41+
```html
42+
<span class=" cd ab bc">Text</span>
43+
```
44+
45+
* Закрывающие тэги не сравниваются
46+
47+
Например, cледующие два кода будут считаться эквивалентными:
48+
49+
```html
50+
<span>Text</span>
51+
```
52+
53+
```html
54+
<span>Text</spane>
55+
```
56+
57+
**ВНИМАНИЕ!** `html-differ` не проверяет валидность `HTML`-кодов, а сравнивает их по выше описанным критериям и задынным опциям (смотрите список возможных опций в [использовании](https://github.com/bem/html-differ/blob/master/README.ru.md#%D0%98%D1%81%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5)).
58+
3859
## Установка
3960

4061
```bash

‎lib/utils.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ exports.sortObj = function sortObj(obj) {
2525
};
2626

2727
/**
28-
* Parses the JSON given in HTML attribute
28+
* Parses the given JSON in HTML attribute
2929
* @param {String} val
3030
* @param {Boolean} [isClick]
3131
* @returns {Object}

0 commit comments

Comments
 (0)