IT4Change/Ocelot-Social
3
0
Fork 0
mirror of https://github.com/IT4Change/Ocelot-Social.git synced 2025-12-13 07:45:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Apply suggestions from code review

Browse Source 
Co-Authored-By: mattwr18 <mattwr18@gmail.com>
Co-Authored-By: Robert Schäfer <git@roschaefer.de>
This commit is contained in:
Alina Beck 2019-11-04 11:45:17 +03:00 committed by GitHub
parent 0d47f6b1d4
commit c7ef9ba04a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
webapp/README.md
View File

@ -45,7 +45,7 @@ For more information see our [frontend testing guide](testing.md). Use these com
{% tabs %}
{% tab title="With Docker" %}
After starting the application following the above guidelines open new terminal windows for each of these commands:
After starting the application following the above guidelines, open new terminal windows for each of these commands:
```bash
# run eslint
@ -68,7 +68,7 @@ You can then visit the Storybook playground on `http://localhost:3002`
{% tab title="Without Docker" %}
After starting the application following the above guidelines open new terminal windows for each of these commands:
After starting the application following the above guidelines, open new terminal windows for each of these commands:
```bash
# run eslint
@ -92,7 +92,7 @@ You can then visit the Storybook playground on `http://localhost:3002`
## Styleguide Migration
We are currently in the process of migrating our styleguide components and design tokens from the [Nitro Styleguide](https://github.com/Human-Connection/Nitro-Styleguide) into the main [Human Connection repository](https://github.com/Human-Connection/Human-Connection) and refactoring our components in the process. During this migration our new components will live in a `view` folder to separate them from the old, yet untouched components.
We are currently in the process of migrating our styleguide components and design tokens from the [Nitro Styleguide](https://github.com/Human-Connection/Nitro-Styleguide) into the main [Human Connection repository](https://github.com/Human-Connection/Human-Connection) and refactoring our components in the process. During this migration, our new components will live in a `view` folder to separate them from the old, yet untouched components.
### Folder Structure

9
webapp/testing.md
View File

@ -13,6 +13,7 @@ We write unit tests with the help of [Jest](https://jestjs.io/) and [Vue Test Ut
To run all tests use the command `yarn test` in the `/webapp` directory. Other useful commands are:
- `yarn test -t test-name` to run tests including `test-name` in their file or test names
- `yarn test -o` to run tests related to files that have been changed since the latest commit
- `yarn run path/to/component.spec.js` to run a single test file
## Documentation and manual testing
@ -20,17 +21,17 @@ To run all tests use the command `yarn test` in the `/webapp` directory. Other u
### Component documentation
With Storybook our components can be documented in detail and offer a visual reference to other developers. When all components are properly documented Storybook can be used as a big component library – where developers can browse through design tokens and components and immediately verify that the component offers the desired functionality.
With Storybook our components can be documented in detail and offer a visual reference to other developers. When all components are properly documented, Storybook can be used as a big component library – where developers can browse through design tokens and components and immediately verify that the component offers the desired functionality.
### Manual testing in an isolated environment
When adding new components or changing existing ones Storybook can be helpful not only to document the feature for future use but also to test different use cases (e.g. by passing different types of `props`) in an isolated playground.
When adding new components or changing existing ones, Storybook can be helpful not only to document the feature for future use, but also to test different use cases (e.g. by passing different types of `props`) in an isolated playground.
With the right addons Storybook also gives immediate feedback on how well the component complies with accessibility guidelines.
With the right addons, Storybook also gives immediate feedback on how well the component complies with accessibility guidelines.
------
To run Storybook first start the app, then enter the following command in a new terminal window: `yarn storybook`. The output should look similar to this:
To run Storybook, first start the app, then enter the following command in a new terminal window: `yarn storybook`. The output should look similar to this:
![Storybook output](../.gitbook/assets/storybook-output.png)