File tree 4 files changed +59
-1
lines changed
examples/lazy-loading-before-mount
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 {
30
30
match . components [ key ] = resolvedDef
31
31
pending --
32
32
if ( pending <= 0 ) {
33
- next ( )
33
+ next ( to )
34
34
}
35
35
} )
36
36
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