twbs
/
bootlint
зеркало из https://github.com/twbs/bootlint.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Merge pull request #235 from twbs/fix-227 

Lint structure of Carousels
This commit is contained in:
Chris Rebert 2015-02-22 15:37:50 -08:00
Родитель bb705ba43d 6d0ac89c35
Коммит c7a1c13525
9 изменённых файлов: 211 добавлений и 0 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

15
src/bootlint.js
Просмотреть файл

@ -811,6 +811,21 @@ var LocationIndex = _location.LocationIndex;
reporter('`.hide` should not be used on `.modal` in Bootstrap v3.', modalsWithHide);
}
});
addLinter("E041", function lintCarouselStructure($, reporter) {
var carouselsWithWrongInners = $('.carousel').filter(function () {
return $(this).children('.carousel-inner').length !== 1;
});
if (carouselsWithWrongInners.length) {
reporter('`.carousel` must have exactly one `.carousel-inner` child.', carouselsWithWrongInners);
}
var innersWithWrongActiveItems = $('.carousel-inner').filter(function () {
return $(this).children('.item.active').length !== 1;
});
if (innersWithWrongActiveItems.length) {
reporter('`.carousel-inner` must have exactly one `.item.active` child.', innersWithWrongActiveItems);
}
});
addLinter("W009", function lintEmptySpacerCols($, reporter) {
var selector = COL_CLASSES.map(function (colClass) {
return colClass + ':not(col):not(:last-child)';

25
test/bootlint_test.js
Просмотреть файл

@ -749,5 +749,30 @@ exports.bootlint = {
'should not complain about a modal without the .hide class.'
);
test.done();
},
'carousel structure': function (test) {
test.expect(5);
test.deepEqual(lintHtml(utf8Fixture('carousel/valid.html')),
[],
'should not complain about correctly structured carousels.'
);
test.deepEqual(lintHtml(utf8Fixture('carousel/missing-inner.html')),
['`.carousel` must have exactly one `.carousel-inner` child.'],
'should complain about a carousel without a .carousel-inner.'
);
test.deepEqual(lintHtml(utf8Fixture('carousel/multiple-inner.html')),
['`.carousel` must have exactly one `.carousel-inner` child.'],
'should complain about a carousel with multiple .carousel-inner children.'
);
test.deepEqual(lintHtml(utf8Fixture('carousel/missing-active-item.html')),
['`.carousel-inner` must have exactly one `.item.active` child.'],
'should complain about a carousel without an active item.'
);
test.deepEqual(lintHtml(utf8Fixture('carousel/multiple-active-item.html')),
['`.carousel-inner` must have exactly one `.item.active` child.'],
'should complain about a carousel with multiple active items.'
);
test.done();
}
};

3
test/fixtures/carousel/controls.html поставляемый
Просмотреть файл

@ -19,6 +19,9 @@
<body>
<div class="carousel slide" data-ride="carousel">
<div class="carousel-inner" role="listbox">
<div class="item active">
<div class="carousel-caption"></div>
</div>
<div class="item">
<div class="carousel-caption"></div>
</div>

3
test/fixtures/carousel/indicators.html поставляемый
Просмотреть файл

@ -22,6 +22,9 @@
<li data-target="#carousel-example-generic" data-slide-to="0"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<div class="carousel-caption"></div>
</div>
<div class="item">
<div class="carousel-caption"></div>
</div>

39
test/fixtures/carousel/missing-active-item.html поставляемый Normal file
Просмотреть файл

@ -0,0 +1,39 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Test</title>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="../../lib/jquery.min.js"></script>
<link rel="stylesheet" href="../../lib/qunit.css">
<script src="../../lib/qunit.js"></script>
<script src="../../../dist/browser/bootlint.js"></script>
<script src="../generic-qunit.js"></script>
</head>
<body>
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item">
<div class="carousel-caption"></div>
</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
</div>
<div id="qunit"></div>
<ol id="bootlint">
<li data-lint="`.carousel-inner` must have exactly one `.item.active` child."></li>
</ol>
</body>
</html>

34
test/fixtures/carousel/missing-inner.html поставляемый Normal file
Просмотреть файл

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Test</title>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="../../lib/jquery.min.js"></script>
<link rel="stylesheet" href="../../lib/qunit.css">
<script src="../../lib/qunit.js"></script>
<script src="../../../dist/browser/bootlint.js"></script>
<script src="../generic-qunit.js"></script>
</head>
<body>
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0"></li>
</ol>
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
</div>
<div id="qunit"></div>
<ol id="bootlint">
<li data-lint="`.carousel` must have exactly one `.carousel-inner` child."></li>
</ol>
</body>
</html>

45
test/fixtures/carousel/multiple-active-item.html поставляемый Normal file
Просмотреть файл

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Test</title>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="../../lib/jquery.min.js"></script>
<link rel="stylesheet" href="../../lib/qunit.css">
<script src="../../lib/qunit.js"></script>
<script src="../../../dist/browser/bootlint.js"></script>
<script src="../generic-qunit.js"></script>
</head>
<body>
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<div class="carousel-caption"></div>
</div>
<div class="item">
<div class="carousel-caption"></div>
</div>
<div class="item active">
<div class="carousel-caption"></div>
</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
</div>
<div id="qunit"></div>
<ol id="bootlint">
<li data-lint="`.carousel-inner` must have exactly one `.item.active` child."></li>
</ol>
</body>
</html>

44
test/fixtures/carousel/multiple-inner.html поставляемый Normal file
Просмотреть файл

@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Test</title>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="../../lib/jquery.min.js"></script>
<link rel="stylesheet" href="../../lib/qunit.css">
<script src="../../lib/qunit.js"></script>
<script src="../../../dist/browser/bootlint.js"></script>
<script src="../generic-qunit.js"></script>
</head>
<body>
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<div class="carousel-caption"></div>
</div>
</div>
<div class="carousel-inner" role="listbox">
<div class="item active">
<div class="carousel-caption"></div>
</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
</div>
<div id="qunit"></div>
<ol id="bootlint">
<li data-lint="`.carousel` must have exactly one `.carousel-inner` child."></li>
</ol>
</body>
</html>

3
test/fixtures/carousel/valid.html поставляемый
Просмотреть файл

@ -22,6 +22,9 @@
<li data-target="#carousel-example-generic" data-slide-to="0"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<div class="carousel-caption"></div>
</div>
<div class="item">
<div class="carousel-caption"></div>
</div>