-
Notifications
You must be signed in to change notification settings - Fork 20
/
test_vuerouter.py
173 lines (134 loc) · 6.02 KB
/
test_vuerouter.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
from selenium.webdriver.common.by import By
VueRouterConfig = {"scripts": {"vue-router": True}}
def test_routes(selenium):
def app(el):
from vue import VueComponent, VueRouter, VueRoute
class Foo(VueComponent):
template = '<div id="content">foo</div>'
class Bar(VueComponent):
text = "bar"
template = '<div id="content">{{ text }}</div>'
class Router(VueRouter):
routes = [VueRoute("/foo", Foo), VueRoute("/bar", Bar)]
class ComponentUsingRouter(VueComponent):
template = """
<div>
<p>
<router-link to="/foo" id="foo">Go to Foo</router-link>
<router-link to="/bar" id="bar">Go to Bar</router-link>
</p>
<router-view></router-view>
</div>
"""
return ComponentUsingRouter(el, router=Router())
with selenium.app(app, config=VueRouterConfig):
assert selenium.element_present("foo")
selenium.find_element(by=By.ID, value="foo").click()
assert selenium.element_has_text("content", "foo")
assert selenium.element_present("bar")
selenium.find_element(by=By.ID, value="bar").click()
assert selenium.element_has_text("content", "bar")
def test_dynamic_route_matching(selenium):
def app(el):
from vue import VueComponent, VueRouter, VueRoute
class User(VueComponent):
template = '<div id="user">{{ $route.params.id }}</div>'
class Router(VueRouter):
routes = [VueRoute("/user/:id", User)]
class ComponentUsingRouter(VueComponent):
template = """
<div>
<p>
<router-link to="/user/123" id="link">User</router-link>
</p>
<router-view></router-view>
</div>
"""
return ComponentUsingRouter(el, router=Router())
with selenium.app(app, config=VueRouterConfig):
assert selenium.element_present("link")
selenium.find_element(by=By.ID, value="link").click()
assert selenium.element_has_text("user", "123")
def test_named_routes(selenium):
def app(el):
from vue import VueComponent, VueRouter, VueRoute
class FooTop(VueComponent):
template = '<div id="header">foo top</div>'
class FooBottom(VueComponent):
template = '<div id="body">foo bottom</div>'
class BarTop(VueComponent):
template = '<div id="header">bar top</div>'
class BarBottom(VueComponent):
template = '<div id="body">bar bottom</div>'
class Router(VueRouter):
routes = [
VueRoute("/foo", components={"default": FooBottom, "top": FooTop}),
VueRoute("/bar", components={"default": BarBottom, "top": BarTop}),
]
class ComponentUsingRouter(VueComponent):
template = """
<div>
<p>
<router-link to="/foo" id="foo">Go to Foo</router-link>
<router-link to="/bar" id="bar">Go to Bar</router-link>
</p>
<router-view name="top"></router-view>
<hr>
<router-view></router-view>
</div>
"""
return ComponentUsingRouter(el, router=Router())
with selenium.app(app, config=VueRouterConfig):
assert selenium.element_present("foo")
selenium.find_element(by=By.ID, value="foo").click()
assert selenium.element_has_text("header", "foo top")
assert selenium.element_has_text("body", "foo bottom")
assert selenium.element_present("bar")
selenium.find_element(by=By.ID, value="bar").click()
assert selenium.element_has_text("header", "bar top")
assert selenium.element_has_text("body", "bar bottom")
def test_nested_routes_and_redirect(selenium):
def app(el):
from vue import VueComponent, VueRouter, VueRoute
class UserHome(VueComponent):
template = '<div id="home">Home</div>'
class UserProfile(VueComponent):
template = '<div id="profile">Profile</div>'
class UserPosts(VueComponent):
template = '<div id="posts">Posts</div>'
class ComponentUsingRouter(VueComponent):
template = """
<div>
<p>
<router-link to="/user/foo" id="link-home">/user/foo</router-link>
<router-link to="/user/foo/profile" id="link-profile">/user/foo/profile</router-link>
<router-link to="/user/foo/posts" id="link-posts">/user/foo/posts</router-link>
</p>
<h2>User {{ $route.params.id }}</h2>
<router-view></router-view>
</div>
"""
class Router(VueRouter):
routes = [
VueRoute("/", redirect="/user/foo"),
VueRoute(
"/user/:id",
ComponentUsingRouter,
children=[
VueRoute("", UserHome),
VueRoute("profile", UserProfile),
VueRoute("posts", UserPosts),
],
),
]
return ComponentUsingRouter(el, router=Router())
with selenium.app(app, config=VueRouterConfig):
assert selenium.element_present("link-home")
selenium.find_element(by=By.ID, value="link-home").click()
assert selenium.element_has_text("home", "Home")
assert selenium.element_present("link-profile")
selenium.find_element(by=By.ID, value="link-profile").click()
assert selenium.element_has_text("profile", "Profile")
assert selenium.element_present("link-posts")
selenium.find_element(by=By.ID, value="link-posts").click()
assert selenium.element_has_text("posts", "Posts")