Skip to content

Latest commit

 

History

History
34 lines (26 loc) · 1.27 KB

no-bootstrap-classes.md

File metadata and controls

34 lines (26 loc) · 1.27 KB

Discourage using Bootstrap layout-oriented CSS classes inside CSS selectors

Ensure layout-oriented Bootstrap classes are not used inside CSS selectors.

Classes like col-lg-pull-5 or col-sm-offset-11 define a container layout on a page and do not bring any valuable information about the element. Neither they uniquely identify elements. Compare these classes with, for example, product or itemPrice classes - these classes are, generally, a good choice to base locators on since they have a "data" meaning not related to the way elements are presented on a page.

Rule details

Current list of Bootstrap classes this rule would complain about can be viewed here (hand-picked).

👎 Any use of the following patterns are considered warnings:

element(by.css(".col-lg-12"));
element.all(by.css(".col-lg-offset-11"));
$(".col-sm-11");
$$(".col-sm-push-4");
$("[class='col-md-10']");
$$("[class*='col-md-offset-4']");
$(".myclass.col-lg-pull-8");
element(by.id("id")).$$(".col-lg-offset-8.myclass");
element(by.id("id")).$("input.col-lg-pull-8");

👍 The following patterns are not warnings:

element(by.css(".myclass"));
element.all(by.css(".myclass"));
$(".myclass");
$$(".myclass");
$("input.myclass");