From b004381e16d35d502d4d1d94f833996f11276671 Mon Sep 17 00:00:00 2001
From: Chris Rebert <code@rebertia.com>
Date: Fri, 20 Feb 2015 12:01:09 -0800
Subject: [PATCH] Complain about .media-left/right outside of .media; fixes
 #224

---
 src/bootlint.js                               |  8 +++++
 test/bootlint_test.js                         | 26 ++++++++++++--
 ...sses.html => deprecated-pull-classes.html} |  0
 test/fixtures/media/media-pull-on-media.html  | 35 +++++++++++++++++++
 test/fixtures/media/misplaced-media-left.html | 26 ++++++++++++++
 .../fixtures/media/misplaced-media-right.html | 26 ++++++++++++++
 6 files changed, 119 insertions(+), 2 deletions(-)
 rename test/fixtures/media/{pull-classes.html => deprecated-pull-classes.html} (100%)
 create mode 100644 test/fixtures/media/media-pull-on-media.html
 create mode 100644 test/fixtures/media/misplaced-media-left.html
 create mode 100644 test/fixtures/media/misplaced-media-right.html

diff --git a/src/bootlint.js b/src/bootlint.js
index 5447d60..0e6af22 100644
--- a/src/bootlint.js
+++ b/src/bootlint.js
@@ -789,6 +789,14 @@ var LocationIndex = _location.LocationIndex;
             reporter("Column widths must be positive integers (and <= 12 by default). Found usage(s) of invalid nonexistent `.col-*-0` classes.", elements);
         }
     });
+    addLinter("E038", function lintMediaPulls($, reporter) {
+        var mediaPullsOutsideMedia = $('.media-left, .media-right').filter(function () {
+            return !($(this).parent().closest('.media').length);
+        });
+        if (mediaPullsOutsideMedia.length) {
+            reporter('`.media-left` and `.media-right` should not be used outside of `.media` objects.', mediaPullsOutsideMedia);
+        }
+    });
     addLinter("W009", function lintEmptySpacerCols($, reporter) {
         var selector = COL_CLASSES.map(function (colClass) {
             return colClass + ':not(col):not(:last-child)';
diff --git a/test/bootlint_test.js b/test/bootlint_test.js
index 182b3cd..a5c9a5b 100644
--- a/test/bootlint_test.js
+++ b/test/bootlint_test.js
@@ -612,7 +612,7 @@ exports.bootlint = {
 
     'pull classes inside media': function (test) {
         test.expect(2);
-        test.deepEqual(lintHtml(utf8Fixture('media/pull-classes.html')),
+        test.deepEqual(lintHtml(utf8Fixture('media/deprecated-pull-classes.html')),
             ['Using `.pull-left` or `.pull-right` as part of the media object component is deprecated as of Bootstrap v3.3.0. Use `.media-left` or `.media-right` instead.'],
             'should complain about .pull-* classes in .media'
         );
@@ -690,7 +690,29 @@ exports.bootlint = {
             'should complain about incorrect indicator control targets.'
         );
         test.deepEqual(lintHtml(utf8Fixture('carousel/valid.html')),
-            [], 'should not complain about correct indicator control targets.'
+            [],
+            'should not complain about correct indicator control targets.'
+        );
+        test.done();
+    },
+
+    'media pulls outside of media objects': function (test) {
+        test.expect(4);
+        test.deepEqual(lintHtml(utf8Fixture('media/media-classes.html')),
+            [],
+            'should not complain about media pulls inside media objects.'
+        );
+        test.deepEqual(lintHtml(utf8Fixture('media/misplaced-media-left.html')),
+            ['`.media-left` and `.media-right` should not be used outside of `.media` objects.'],
+            'should complain about .media-left outside of a media object.'
+        );
+        test.deepEqual(lintHtml(utf8Fixture('media/misplaced-media-right.html')),
+            ['`.media-left` and `.media-right` should not be used outside of `.media` objects.'],
+            'should complain about .media-right outside of a media object.'
+        );
+        test.deepEqual(lintHtml(utf8Fixture('media/media-pull-on-media.html')),
+            ['`.media-left` and `.media-right` should not be used outside of `.media` objects.'],
+            'should complain about media pulls on .media itself.'
         );
         test.done();
     }
diff --git a/test/fixtures/media/pull-classes.html b/test/fixtures/media/deprecated-pull-classes.html
similarity index 100%
rename from test/fixtures/media/pull-classes.html
rename to test/fixtures/media/deprecated-pull-classes.html
diff --git a/test/fixtures/media/media-pull-on-media.html b/test/fixtures/media/media-pull-on-media.html
new file mode 100644
index 0000000..9f9f293
--- /dev/null
+++ b/test/fixtures/media/media-pull-on-media.html
@@ -0,0 +1,35 @@
+<!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 class="media media-left">
+            <div class="media-body">
+                <h4 class="media-heading">Media heading</h4>
+            </div>
+        </div>
+        <div class="media media-right">
+            <div class="media-body">
+                <h4 class="media-heading">Media heading</h4>
+            </div>
+        </div>
+        <div id="qunit"></div>
+        <ol id="bootlint">
+            <li data-lint="`.media-left` and `.media-right` should not be used outside of `.media` objects."></li>
+        </ol>
+    </body>
+</html>
diff --git a/test/fixtures/media/misplaced-media-left.html b/test/fixtures/media/misplaced-media-left.html
new file mode 100644
index 0000000..ec284a9
--- /dev/null
+++ b/test/fixtures/media/misplaced-media-left.html
@@ -0,0 +1,26 @@
+<!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>
+        <a class="media-left" href="#">Where is my media object?</a>
+        <div id="qunit"></div>
+        <ol id="bootlint">
+            <li data-lint="`.media-left` and `.media-right` should not be used outside of `.media` objects."></li>
+        </ol>
+    </body>
+</html>
diff --git a/test/fixtures/media/misplaced-media-right.html b/test/fixtures/media/misplaced-media-right.html
new file mode 100644
index 0000000..64957db
--- /dev/null
+++ b/test/fixtures/media/misplaced-media-right.html
@@ -0,0 +1,26 @@
+<!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>
+        <a class="media-right" href="#">Where is my media object?</a>
+        <div id="qunit"></div>
+        <ol id="bootlint">
+            <li data-lint="`.media-left` and `.media-right` should not be used outside of `.media` objects."></li>
+        </ol>
+    </body>
+</html>