diff --git a/docs/autoredraw.md b/docs/autoredraw.md index 821b123b..97a4575d 100644 --- a/docs/autoredraw.md +++ b/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() { - return m("div", {onclick: doSomething}) - } + view: function() { + 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() { - return m("div", {onclick: doSomething}) - } + view: function() { + return m("div", {onclick: doSomething}) + } } function doSomething(e) { - e.redraw = false - // no longer triggers a redraw when the div is clicked + e.redraw = false + // 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() { - return [ - // a redraw happens asynchronously after the route changes - m("a", {href: "/", oncreate: m.route.link}), - m("div", { - onclick: function() { - m.route.set("/") - } - }), - ] - } + view: function() { + return [ + // a redraw happens asynchronously after the route changes + m("a", {href: "/", oncreate: m.route.link}), + m("div", { + onclick: function() { + 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) { - vnode.state.height = vnode.dom.offsetHeight - m.redraw() - }, - view: function() { - return m("div", "This component is " + vnode.state.height + "px tall") - } + oncreate: function(vnode) { + vnode.state.height = vnode.dom.offsetHeight + m.redraw() + }, + view: function() { + return m("div", "This component is " + vnode.state.height + "px tall") + } } ``` diff --git a/docs/jsx.md b/docs/jsx.md index b0c0ff75..68cc7e4f 100644 --- a/docs/jsx.md +++ b/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 = {greeting + "!"} @@ -43,7 +43,7 @@ var div = {greeting + "!"} Components can be used by using a convention of uppercasing the first letter of the component name: -```javascript +```jsx m.mount(document.body, ) // 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() {/*...*/}, diff --git a/docs/lint.js b/docs/lint.js index 3f87d200..7a83af80 100644 --- a/docs/lint.js +++ b/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: ""} + }, }) } diff --git a/test-utils/xhrMock.js b/test-utils/xhrMock.js index 0a7b8f8d..37d48e92 100644 --- a/test-utils/xhrMock.js +++ b/test-utils/xhrMock.js @@ -7,8 +7,8 @@ var parseQueryString = require("../querystring/parse") module.exports = function() { var routes = {} var callback = "callback" - var serverErrorHandler = function() { - return {status: 500, responseText: "server error, most likely the URL was not defined"} + var serverErrorHandler = function(url) { + 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() {