server: Store mount selector and return this (#625)
* Store mount selector and return `this`
This allows `.mount('body')` to be used on the server like so:
```js
module.exports = app.mount('body')
```
Then, when server rendering you can do:
```js
var app = require('./app')
fillServerTemplate(html, app.selector, app.toString('/'))
```
Where `fillServerTemplate` is a function that replaces the HTML at a
CSS selector with some string.
This way you do not need to check for `typeof window` in your
application entry point to do server rendering, and it allows tools like
bankai to automatically inline server rendered html in the correct place.
* docs
* better words
This commit is contained in:
@@ -459,9 +459,18 @@ See [#routing](#routing) for an overview of how to use routing efficiently.
|
||||
Start the application and mount it on the given `querySelector`,
|
||||
the given selector can be a String or a DOM element.
|
||||
|
||||
This will _replace_ the selector provided with the tree returned from `app.start()`.
|
||||
In the browser, this will _replace_ the selector provided with the tree returned from `app.start()`.
|
||||
If you want to add the app as a child to an element, use `app.start()` to obtain the tree and manually append it.
|
||||
|
||||
On the server, this will save the `selector` on the app instance.
|
||||
When doing server side rendering, you can then check the `app.selector` property to see where the render result should be inserted.
|
||||
|
||||
Returns `this`, so you can easily export the application for server side rendering:
|
||||
|
||||
```js
|
||||
module.exports = app.mount('body')
|
||||
```
|
||||
|
||||
### `tree = app.start()`
|
||||
Start the application. Returns a tree of DOM nodes that can be mounted using
|
||||
`document.body.appendChild()`.
|
||||
|
||||
@@ -153,7 +153,12 @@ Choo.prototype.start = function () {
|
||||
}
|
||||
|
||||
Choo.prototype.mount = function mount (selector) {
|
||||
assert.equal(typeof window, 'object', 'choo.mount: window was not found. .mount() must be called in a browser, use .toString() if running in Node')
|
||||
if (typeof window !== 'object') {
|
||||
assert.ok(typeof selector === 'string', 'choo.mount: selector should be type String')
|
||||
this.selector = selector
|
||||
return this
|
||||
}
|
||||
|
||||
assert.ok(typeof selector === 'string' || typeof selector === 'object', 'choo.mount: selector should be type String or HTMLElement')
|
||||
|
||||
var self = this
|
||||
|
||||
Reference in New Issue
Block a user