lint and highlight jsx

docs/autoredraw.md

@@ -12,13 +12,13 @@ Mithril automatically redraws after DOM event handlers that are defined in a Mit
 
 ```javascript
 var MyComponent = {
-  view: function() {
+	view: function() {
-    return m("div", {onclick: doSomething})
+		return m("div", {onclick: doSomething})
-  }
+	}
 }
 
 function doSomething() {
-  //a redraw happens synchronously after this function runs
+	// a redraw happens synchronously after this function runs
 }
 
 m.mount(document.body, MyComponent)
@@ -28,14 +28,14 @@ You can disable an auto-redraw for specific events by setting `e.redraw` to `fal
 
 ```javascript
 var MyComponent = {
-  view: function() {
+	view: function() {
-    return m("div", {onclick: doSomething})
+		return m("div", {onclick: doSomething})
-  }
+	}
 }
 
 function doSomething(e) {
-  e.redraw = false
+	e.redraw = false
-  // no longer triggers a redraw when the div is clicked
+	// no longer triggers a redraw when the div is clicked
 }
 
 m.mount(document.body, MyComponent)
@@ -48,7 +48,7 @@ Mithril automatically redraws after [`m.request`](request.md) completes:
 
 ```javascript
 m.request("/api/v1/users").then(function() {
-  //a redraw happens after this function runs
+	// a redraw happens after this function runs
 })
 ```
 
@@ -56,7 +56,7 @@ You can disable an auto-redraw for a specific request by setting the `background
 
 ```javascript
 m.request("/api/v1/users", {background: true}).then(function() {
-  //does not trigger a redraw
+	// does not trigger a redraw
 })
 ```
 
@@ -67,21 +67,21 @@ Mithril automatically redraws after [`m.route.set()`](route.md#mrouteset) calls
 
 ```javascript
 var RoutedComponent = {
-  view: function() {
+	view: function() {
-    return [
+		return [
-      // a redraw happens asynchronously after the route changes
+			// a redraw happens asynchronously after the route changes
-      m("a", {href: "/", oncreate: m.route.link}),
+			m("a", {href: "/", oncreate: m.route.link}),
-      m("div", {
+			m("div", {
-        onclick: function() {
+				onclick: function() {
-          m.route.set("/")
+					m.route.set("/")
-        }
+				}
-      }),
+			}),
-    ]
+		]
-  }
+	}
 }
 
 m.route(document.body, "/", {
-  "/": RoutedComponent,
+	"/": RoutedComponent,
 })
 ```
 
@@ -97,13 +97,13 @@ If you need to explicitly trigger a redraw within a lifecycle method, you should
 
 ```javascript
 var StableComponent = {
-  oncreate: function(vnode) {
+	oncreate: function(vnode) {
-    vnode.state.height = vnode.dom.offsetHeight
+		vnode.state.height = vnode.dom.offsetHeight
-    m.redraw()
+		m.redraw()
-  },
+	},
-  view: function() {
+	view: function() {
-    return m("div", "This component is " + vnode.state.height + "px tall")
+		return m("div", "This component is " + vnode.state.height + "px tall")
-  }
+	}
 }
 ```
 

docs/jsx.md

@@ -12,7 +12,7 @@
 
 JSX is a syntax extension that enables you to write HTML tags interspersed with Javascript.
 
-```
+```jsx
 var MyComponent = {
   view: function() {
     return m("main", [
@@ -35,7 +35,7 @@ var MyComponent = {
 
 When using JSX, it's possible to interpolate Javascript expressions within JSX tags by using curly braces:
 
-```
+```jsx
 var greeting = "Hello"
 var url = "http://google.com"
 var div = <a href={url}>{greeting + "!"}</a>
@@ -43,7 +43,7 @@ var div = <a href={url}>{greeting + "!"}</a>
 
 Components can be used by using a convention of uppercasing the first letter of the component name:
 
-```javascript
+```jsx
 m.mount(document.body, <MyComponent />)
 // equivalent to m.mount(document.body, m(MyComponent))
 ```
@@ -190,7 +190,7 @@ Hyperscript is the compiled representation of JSX. It's designed to be readable
 
 In addition, since hyperscript is plain Javascript, it's often more natural to indent than JSX:
 
-```
+```jsx
 //JSX
 var BigComponent = {
   activate: function() {/*...*/},

docs/lint.js

@@ -122,6 +122,9 @@ function initMocks() {
 		"GET /api/v1/users/foo:bar": function(request) {
 			return {status: 200, responseText: JSON.stringify({id: 123})}
 		},
+		"GET /files/image.svg": function(request) {
+			return {status: 200, responseText: "<svg></svg>"}
+		},
 	})
 }
 

test-utils/xhrMock.js

@@ -7,8 +7,8 @@ var parseQueryString = require("../querystring/parse")
 module.exports = function() {
 	var routes = {}
 	var callback = "callback"
-	var serverErrorHandler = function() {
+	var serverErrorHandler = function(url) {
-		return {status: 500, responseText: "server error, most likely the URL was not defined"}
+		return {status: 500, responseText: "server error, most likely the URL was not defined " + url}
 	}
 
 	var $window = {
@@ -32,7 +32,7 @@ module.exports = function() {
 			}
 			this.send = function(body) {
 				var self = this
-				var handler = routes[args.method + " " + args.pathname] || serverErrorHandler
+				var handler = routes[args.method + " " + args.pathname] || serverErrorHandler.bind(null, args.pathname)
 				var data = handler({url: args.pathname, query: args.search || {}, body: body || null})
 				self.readyState = 4
 				self.status = data.status
@@ -54,7 +54,7 @@ module.exports = function() {
 					element.parentNode = this
 					if (element.nodeName === "SCRIPT") {
 						var urlData = parseURL(element.src, {protocol: "http:", hostname: "localhost", port: "", pathname: "/"})
-						var handler = routes["GET " + urlData.pathname] || serverErrorHandler
+						var handler = routes["GET " + urlData.pathname] || serverErrorHandler.bind(null, element.src)
 						var data = handler({url: urlData.pathname, query: urlData.search, body: null})
 						var query = parseQueryString(urlData.search)
 						callAsync(function() {