Add manual test for correct source maps

jhnns · jhnns · commit 9b9af8762655 · 2015-03-06T16:54:56.000+01:00
diff --git a/package.json b/package.json
@@ -4,13 +4,16 @@
   "author": "Tobias Koppers @sokra",
   "description": "less loader module for webpack",
   "scripts": {
-    "test": "mocha -R spec"
+    "test": "mocha -R spec",
+    "test-source-map": "webpack --config test/sourceMap/webpack.config.js && open ./test/sourceMap/index.html"
   },
   "peerDependencies": {
     "less": "^2.3.1"
   },
   "devDependencies": {
+    "css-loader": "^0.9.1",
     "enhanced-require": "^0.5.0-beta6",
+    "extract-text-webpack-plugin": "^0.3.8",
     "less": "^2.3.1",
     "mocha": "^2.0.1",
     "raw-loader": "^0.5.1",
diff --git a/test/css/source-map.css b/test/css/source-map.css
@@ -1,11 +1,6 @@
-.box {
-  color: #fe33ac;
-  border-color: #fdcdea;
-  background: url(box.png);
-}
-.box div {
-  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
-  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
+.modules-dir-some-module,
+#it-works {
+  color: hotpink;
 }
 #it-works {
   margin: 10px;
diff --git a/test/less/source-map.less b/test/less/source-map.less
@@ -1,5 +1,6 @@
-@import "basic";
+// Should usually be imported with '~' but since our test setup for this is complicated, we don't use it here
+@import "../bower_components/some/module";
 
-#it-works {
+#it-works:extend(.modules-dir-some-module) {
   margin: 10px;
 }
diff --git a/test/sourceMap/entry.js b/test/sourceMap/entry.js
@@ -0,0 +1,3 @@
+"use strict";
+
+require("../less/source-map.less");
diff --git a/test/sourceMap/index.html b/test/sourceMap/index.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title></title>
+    <meta charset="utf-8"/>
+    <link href="../output/styles.css" type="text/css" rel="stylesheet">
+</head>
+<body class="modules-dir-some-module">
+    <h1 id="it-works">Open the developer tools, dude!</h1>
+</body>
+</html>
diff --git a/test/sourceMap/webpack.config.js b/test/sourceMap/webpack.config.js
@@ -0,0 +1,29 @@
+"use strict";
+
+var path = require("path");
+var ExtractTextPlugin = require("extract-text-webpack-plugin");
+
+var pathToLessLoader = path.resolve(__dirname, "../../index.js");
+
+module.exports = {
+    entry: path.resolve(__dirname, "./entry.js"),
+    output: {
+        path: path.resolve(__dirname, "../output"),
+        filename: "bundle.sourcemap.js"
+    },
+    devtool: "inline-source-map",
+    module: {
+        loaders: [
+            {
+                test: /\.less/,
+                loader: ExtractTextPlugin.extract(
+                    "css-loader?sourceMap!" +
+                    pathToLessLoader + "?sourceMap"
+                )
+            }
+        ]
+    },
+    plugins: [
+        new ExtractTextPlugin("styles.css")
+    ]
+};

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,6 @@`
`1`		`-@import "basic";`
	`1`	`+// Should usually be imported with '~' but since our test setup for this is complicated, we don't use it here`
	`2`	`+@import "../bower_components/some/module";`
`2`	`3`
`3`		`-#it-works {`
	`4`	`+#it-works:extend(.modules-dir-some-module) {`
`4`	`5`	`margin: 10px;`
`5`	`6`	`}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+"use strict";`
	`2`	`+`
	`3`	`+require("../less/source-map.less");`