Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
G
gitlab-ce
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
Boxiang Sun
gitlab-ce
Commits
bcd4ef2e
Commit
bcd4ef2e
authored
May 17, 2017
by
Luke "Jared" Bennett
Committed by
Clement Ho
May 17, 2017
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Update fe_guide testing.md
parent
d4d9b731
Changes
2
Show whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
30 additions
and
9 deletions
+30
-9
doc/development/fe_guide/img/testing_triangle.png
doc/development/fe_guide/img/testing_triangle.png
+0
-0
doc/development/fe_guide/testing.md
doc/development/fe_guide/testing.md
+30
-9
No files found.
doc/development/fe_guide/img/testing_triangle.png
0 → 100644
View file @
bcd4ef2e
11.6 KB
doc/development/fe_guide/testing.md
View file @
bcd4ef2e
# Frontend Testing
# Frontend Testing
There are two types of tests you'll encounter while developing frontend code
There are two types of test
suite
s you'll encounter while developing frontend code
at GitLab. We use Karma and Jasmine for JavaScript unit testing, and RSpec
at GitLab. We use Karma and Jasmine for JavaScript unit
and integration
testing, and RSpec
feature tests with Capybara for integration testing.
feature tests with Capybara for
e2e (end-to-end)
integration testing.
Feature tests need to be written for all new features. Regression tests ought
Unit and feature tests need to be written for all new features.
to be written for all bug fixes to prevent them from recurring in the future.
Most of the time, you should use rspec for your feature tests.
There are cases where the behaviour you are testing is not worth the time spent running the full application,
for example, if you are testing styling, animation or small actions that don't involve the backend,
you should write an integration test using Jasmine.
![
Testing priority triangle
](
img/testing_triangle.png
)
_This diagram demonstrates the relative priority of each test type we use_
Regression tests should be written for bug fixes to prevent them from recurring in the future.
See
[
the Testing Standards and Style Guidelines
](
../testing.md
)
See
[
the Testing Standards and Style Guidelines
](
../testing.md
)
for more information on general testing practices at GitLab.
for more information on general testing practices at GitLab.
...
@@ -13,10 +22,12 @@ for more information on general testing practices at GitLab.
...
@@ -13,10 +22,12 @@ for more information on general testing practices at GitLab.
## Karma test suite
## Karma test suite
GitLab uses the
[
Karma
][
karma
]
test runner with
[
Jasmine
][
jasmine
]
as its test
GitLab uses the
[
Karma
][
karma
]
test runner with
[
Jasmine
][
jasmine
]
as its test
framework for our JavaScript unit
tests. For tests that rely on DOM
framework for our JavaScript unit
and integration tests. For integration tests,
manipulation, we generate HTML files using RSpec suites
(see
`spec/javascripts/fixtures/*.rb`
for examples).
we generate HTML files using RSpec
(see
`spec/javascripts/fixtures/*.rb`
for examples).
Some fixtures are still HAML templates that are translated to HTML files using the same mechanism (see
`static_fixtures.rb`
).
Some fixtures are still HAML templates that are translated to HTML files using the same mechanism (see
`static_fixtures.rb`
).
Those will be migrated over time.
Adding these static fixtures should be avoided as they are harder to keep up to date with real views.
The existing static fixtures will be migrated over time.
Please see
[
gitlab-org/gitlab-ce#24753
](
https://gitlab.com/gitlab-org/gitlab-ce/issues/24753
)
to track our progress.
Fixtures are served during testing by the
[
jasmine-jquery
][
jasmine-jquery
]
plugin.
Fixtures are served during testing by the
[
jasmine-jquery
][
jasmine-jquery
]
plugin.
JavaScript tests live in
`spec/javascripts/`
, matching the folder structure
JavaScript tests live in
`spec/javascripts/`
, matching the folder structure
...
@@ -28,7 +39,9 @@ browser and you will not have access to certain APIs, such as
...
@@ -28,7 +39,9 @@ browser and you will not have access to certain APIs, such as
[
`Notification`
](
https://developer.mozilla.org/en-US/docs/Web/API/notification
)
,
[
`Notification`
](
https://developer.mozilla.org/en-US/docs/Web/API/notification
)
,
which will have to be stubbed.
which will have to be stubbed.
### Writing tests
### Best practice
#### Naming unit tests
When writing describe test blocks to test specific functions/methods,
When writing describe test blocks to test specific functions/methods,
please use the method name as the describe block name.
please use the method name as the describe block name.
...
@@ -56,6 +69,14 @@ describe('.methodName', () => {
...
@@ -56,6 +69,14 @@ describe('.methodName', () => {
});
});
```
```
#### Stubbing
For unit tests, you should stub methods that are unrelated to the current unit you are testing.
If you need to use a prototype method, instantiate an instance of the class and call it there instead of mocking the instance completely.
For integration tests, you should stub methods that will effect the stability of the test if they
execute their original behaviour. i.e. Network requests.
### Vue.js unit tests
### Vue.js unit tests
See this
[
section
][
vue-test
]
.
See this
[
section
][
vue-test
]
.
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment