File tree Expand file tree Collapse file tree 4 files changed +59
-1
lines changed
examples/lazy-loading-before-mount Expand file tree Collapse file tree 4 files changed +59
-1
lines changed Original file line number Diff line number Diff line change 1+ import Vue from 'vue'
2+ import VueRouter from 'vue-router'
3+
4+ Vue . use ( VueRouter )
5+
6+ const Home = { template : '<div>Home</div>' }
7+ const Foo = ( ) =>
8+ new Promise ( resolve => {
9+ setTimeout ( ( ) =>
10+ resolve ( {
11+ template : `<div class="foo">This is Foo</div>`
12+ } )
13+ , 10 )
14+ } )
15+
16+ const router = new VueRouter ( {
17+ mode : 'history' ,
18+ base : __dirname ,
19+ routes : [
20+ { path : '/' , component : Home } ,
21+ // Just use them normally in the route config
22+ { path : '/async' , component : Foo }
23+ ]
24+ } )
25+
26+ router . push ( '/async' )
27+
28+ document . getElementById ( 'load-button' ) . addEventListener ( 'click' , ( event ) => {
29+ new Vue ( {
30+ router,
31+ template : `
32+ <div id="app">
33+ <h1>Async</h1>
34+ <router-view class="view"></router-view>
35+ </div>
36+ `
37+ } ) . $mount ( '#app' )
38+ event . target . remove ( )
39+ } )
Original file line number Diff line number Diff line change 1+ <!DOCTYPE html>
2+ < link rel ="stylesheet " href ="/global.css ">
3+ < a href ="/ "> ← Examples index</ a >
4+ < div id ="app "> </ div >
5+
6+ < button id ="load-button "> Load</ button >
7+ < script src ="/__build__/shared.chunk.js "> </ script >
8+ < script src ="/__build__/lazy-loading-before-mount.js "> </ script >
Original file line number Diff line number Diff line change @@ -30,7 +30,7 @@ export function resolveAsyncComponents (matched: Array<RouteRecord>): Function {
3030 match . components [ key ] = resolvedDef
3131 pending --
3232 if ( pending <= 0 ) {
33- next ( )
33+ next ( to )
3434 }
3535 } )
3636
Original file line number Diff line number Diff line change 1+ module . exports = {
2+ 'lazy loading before mount' : function ( browser ) {
3+ browser
4+ . url ( 'http://localhost:8080/lazy-loading-before-mount/' )
5+ // wait for the Foo component to be resolved
6+ . click ( '#load-button' )
7+ . waitForElementVisible ( '.foo' , 1000 )
8+ . assert . containsText ( '.view' , 'This is Foo' )
9+ . end ( )
10+ }
11+ }
You can’t perform that action at this time.
0 commit comments