openstack/skyline-console
Code Issues Proposed changes

docs: Change md file to rst file

Browse Source 
add test guide

Change-Id: I3194ff9cd846ded71852fff0ad20e56c383bf77a
This commit is contained in:
yangsngshaoxue 2022-09-08 15:03:54 +08:00 committed by conna
parent b5eb669efa
commit 2f4eb2d36b
8 changed files with 421 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
doc/source/development/catalog-introduction.rst Normal file
View File

@ -0,0 +1,2 @@
Catalog Introduction
~~~~~~~~~~~~~~~~~~~~

2
doc/source/development/how-to-develop.rst Normal file
View File

@ -0,0 +1,2 @@
How To Develop
~~~~~~~~~~~~~~~

7
doc/source/development/index.rst
View File

@ -2,5 +2,10 @@
Development Guide Development Guide
================== ==================
This section describes how to develop the Skyline Console.
.. toctree:: .. toctree::
:maxdepth: 1
ready-to-work
catalog-introduction
how-to-develop

2
doc/source/development/ready-to-work.rst Normal file
View File

@ -0,0 +1,2 @@
Ready To Work
~~~~~~~~~~~~~~

99
doc/source/test/catalog-introduction.rst Normal file
View File

@ -0,0 +1,99 @@
Catalog Introduction
~~~~~~~~~~~~~~~~~~~~
.. code-block:: text
test
├── e2e (E2E code storage location)
│ ├── config
│ │ ├── config.yaml (Part of the configuration when E2E running, mainly configures the test case file list, login account and other information)
│ │ └── local_config.yaml (Part of the configuration when E2E running, mainly configures the test case file list, login account and other information, which is gitignore and has a higher priority than config.yaml)
│ ├── fixtures (Store upload files, read files, etc. required during operation)
│ │ ├── keypair (Test file read by key)
│ │ ├── metadata.json (Test metadata read file)
│ │ ├── stack-content.yaml (Files read by the test stack)
│ │ └── stack-params.yaml (Files read by the test stack)
│ ├── integration (Store unit test)
│ │ └── pages (Adjust the directory according to the webpage menu structure)
│ │ ├── compute (compute)
│ │ │ ├── aggregate.spec.js (aggregate)
│ │ │ ├── baremetal.spec.js (baremetal)
│ │ │ ├── flavor.spec.js (instance flavor)
│ │ │ ├── hypervisor.spec.js (hypervisor)
│ │ │ ├── image.spec.js (image)
│ │ │ ├── instance.spec.js (instance)
│ │ │ ├── ironic.spec.js (ironic)
│ │ │ ├── keypair.spec.js (keypair)
│ │ │ └── server-group.spec.js (server group)
│ │ ├── configuration (Platform configuration)
│ │ │ ├── metadata.spec.js (metadata)
│ │ │ └── system.spec.js (system info)
│ │ ├── error.spec.js (error page)
│ │ ├── heat (heat)
│ │ │ └── stack.spec.js (stack)
│ │ ├── identity (identity)
│ │ │ ├── domain.spec.js (Domain)
│ │ │ ├── project.spec.js (Project)
│ │ │ ├── role.spec.js (Role)
│ │ │ ├── user-group.spec.js (User group)
│ │ │ └── user.spec.js (User)
│ │ ├── login.spec.js (Login)
│ │ ├── management (Operation management)
│ │ │ └── recycle-bin.spec.js (Recycle)
│ │ ├── network (Network)
│ │ │ ├── floatingip.spec.js (Floating ip)
│ │ │ ├── lb.spec.js (Loadbalance)
│ │ │ ├── network.spec.js (Network)
│ │ │ ├── qos-policy.spec.js (Qos policy)
│ │ │ ├── router.spec.js (Router)
│ │ │ ├── security-group.spec.js (Security group)
│ │ │ ├── topology.spec.js (Network topology)
│ │ │ ├── port.spec.js (Virtual Adapter)
│ │ │ └── vpn.spec.js (VPN)
│ │ └── storage (Storage)
│ │ ├── backup.spec.js (Backup)
│ │ ├── qos.spec.js (QoS)
│ │ ├── snapshot.spec.js (Volume snapshot)
│ │ ├── storage.spec.js (Storage)
│ │ ├── volume-type.spec.js (Volume type)
│ │ └── volume.spec.js (Volume)
│ ├── plugins (Cypress plugins)
│ │ └── index.js (Configured to read the configuration file, configured to use the code coverage function)
│ ├── report (Store E2E test report)
│ │ ├── merge-report.html (The final test report that records the execution of each use case)
│ │ └── merge-report.json (Summary of test results in the results directory)
│ ├── results (Store test result files)
│ ├── screenshots (Store a snapshot of the test error)
│ ├── support (When writing a test case, double-wrapped function)
│ │ ├── commands.js (Store login, logout and other operation functions)
│ │ ├── common.js (Store base functions)
│ │ ├── constants.js (Store the route of each resource)
│ │ ├── detail-commands.js (Store the functions related to the resource detail page, based on the framework, the operation of the detail page is consistent)
│ │ ├── form-commands.js (Stores form-related functions, based on the framework, consistent with the operation of form items)
│ │ ├── index.js
│ │ ├── resource-commands.js (Store functions related to resource operations, such as creating instance, creating router, deleting resources, etc.)
│ │ └── table-commands.js (Store the functions related to the resource list based on the framework, and it has consistency in the operation of the lis)
│ └── utils (Store the read function for the configuration file)
│ └── index.js
└── unit (Unit test)
├── local-storage-mock.js ( Storage mock function in local)
├── locales (Translation files used when testing internationalization)
│ ├── en-US.js
│ └── zh-CN.js
├── setup-tests.js (setup uni test)
└── svg-mock.js (Mock of image loading)
#. E2E test code, stored in the ``test/e2e`` directory
- Other global configurations of E2E are stored in ``cypress.json``
#. The basic code of the unit test is stored in the ``test/unit`` directory
- Other global configuration of unit test, stored in ``jest.config.js``
- The test code of the unit test is usually placed in the same directory
as the file to be tested, and has a suffix of ``test.js`` or ``spec.js``
- case: ``src/utils/index.js`` and ``src/utils/index.test.js``
- case: ``src/utils/local-storage.js`` and ``src/utils/local-storage.spec.js``

142
doc/source/test/how-to-edit-e2e-case.rst Normal file
View File

@ -0,0 +1,142 @@
How To Edit E2E Case
~~~~~~~~~~~~~~~~~~~~
For specific introduction and usage of Cypress, please refer to
`Official document <https://docs.cypress.io/guides/overview/why-cypress>`__.
Here we mainly give the E2E use cases corresponding to the resources in the
front-end page of Skyline-console, and use function defined in ``test/e2e/support``
The following is an introduction, taking the instance use case
``test/e2e/integration/pages/compute/instance.spec.js`` as an example
Generally, when testing the corresponding functions of a resource,
follow the following order
#. Prepare relevant variables in text
- Required parameters when creating a resource, such as: name, password
- Required parameters when editing resources, such as: new name
- When creating an associated resource, the name of the associated resource,
such as: network name, router name, volume name
.. code-block:: javascript
const uuid = Cypress._.random(0, 1e6);
const name = `e2e-instance-${uuid}`;
const newname = `${name}-1`;
const password = 'passW0rd_1';
const volumeName = `e2e-instance-attach-volume-${uuid}`;
const networkName = `e2e-network-for-instance-${uuid}`;
const routerName = `e2e-router-for-instance-${uuid}`;
#. Login before operation
- If you are operating console resources, please use :guilabel:`cy.login`
- If you are operating administrator resource, please use :guilabel:`cy.loginAdmin`
- Generally, the variable :guilabel:`listUrl` is used in the
:guilabel:`login` and :guilabel:`loginAdmin` functions, that is,
directly access the page where the resource is located after logging in
.. code-block:: javascript
beforeEach(() => {
cy.login(listUrl);
});
#. Create associated resources, use the resource creation function provided in
``resource-commands.js``, take the test instance as an example
- Create a network for testing to create a instance, attach interface
.. code-block:: javascript
cy.createNetwork({ name: networkName });
- Create router :guilabel:`cy.createRouter` to ensure that the
floating IP is reachable when testing the associated floating IP
- The router created in the following way will open the external network
gateway and bind the subnet of the :guilabel:`networkName` network
.. code-block:: javascript
cy.createRouter({ name: routerName, network: networkName });
- Create floating ip :guilabel:`cy.createFip`,
Used to test associate floating ip
.. code-block:: javascript
cy.createFip();
- Create volume :guilabel:`cy.createVolume` (Used to test attach volume)
.. code-block:: javascript
cy.createVolume(volumeName);
#. Write cases for creating resources
#. Write use cases for accessing resource details
#. Write use cases corresponding to all operations of resources separately
Generally, the use case of the :guilabel:`edit` operation is written later,
and then the use case of the :guilabel:`delete` operation is written,
so that you can test whether the editing is effective
#. To delete associated resources, use the resource-deleting function provided
in ``resource-commands.js``, this is to make the resources in the test
account as clean as possible after the test case is executed
- Delete Floating IP
.. code-block:: javascript
cy.deleteAll('fip');
- Delete Router :guilabel:`routerName`
.. code-block:: javascript
cy.deleteRouter(routerName, networkName);
- Delete Network :guilabel:`networkName`
.. code-block:: javascript
cy.deleteAll('network', networkName);
- Delete Volume :guilabel:`volumeName`
.. code-block:: javascript
cy.deleteAll('volume', volumeName);
- Delete all available volume
.. code-block:: javascript
cy.deleteAllAvailableVolume();
The ``4``, ``5``, and ``6`` in the above steps are mainly used
- The function operation form in ``test/e2e/support/form-commands.js``,
please refer to the detailed introduction
- The functions in ``test/e2e/support/table-commands.js``,
click on the buttons in the operation table, search, and enter for details.
please refer to the detailed introduction
- The functions in ``test/e2e/support/detail-commands.js``, the operation
returns the list page, the detection details, and the switching details Tab.
please refer to the detailed introduction
Create and delete associated resources mainly use the functions in
``test/e2e/support/resource-commands.js``, please refer to the detailed
introduction

7
doc/source/test/index.rst
View File

@ -2,5 +2,10 @@
Tests Guide Tests Guide
=========== ===========
This section describes how to test the Skyline Console.
.. toctree:: .. toctree::
:maxdepth: 1
ready-to-work
catalog-introduction
how-to-edit-e2e-case

162
doc/source/test/ready-to-work.rst Normal file
View File

@ -0,0 +1,162 @@
Ready To Work
~~~~~~~~~~~~~~
We provide two test methods
- E2E test
- Focus on function point testing
- Can provide code coverage data
- User ``Cypress`` frame
- Test results are saved in a static page for easy preview
- Unit test
- Focus on basic function testing
- User ``Jest`` frame
E2E test
---------
#. Set up E2E test environment
.. note::
For more information about installation, refer to the :ref:`source-install-ubuntu`
E2E test environment has been successfully built in Centos and wsl2 of Windows
#. node environment
- requirement in package.json: ``"node": ">=10.22.0"``
- verify nodejs version
.. code-block:: console
node -v
#. install yarn
.. code-block:: console
npm install -g yarn
#. Install dependencies
- Execute in the project root directory, which is the same level as
``package.json``, and wait patiently for the installation to complete
.. code-block:: console
yarn install
#. Install system dependencies
- `Ubuntu/Debian`
.. code-block:: console
sudo apt-get install libgtk2.0-0 libgtk-3-0 libgbm-dev libnotify-dev libgconf-2-4 libnss3 libxss1 libasound2 libxtst6 xauth xvfb
- `CentOS`
.. code-block:: console
yum install -y xorg-x11-server-Xvfb gtk2-devel gtk3-devel libnotify-devel GConf2 nss libXScrnSaver alsa-lib
#. Adjust the access path, account and other information
E2E configuration files are stored in ``test/e2e/config/config.yaml``,
Configured in it:
* :guilabel:`baseUrl`, test access path
* :guilabel:`env`, environment variable
- :guilabel:`switchToAdminProject`, Switch to the ``admin`` project
after logging in
- :guilabel:`username`, User name to access the console, a user with
console operation permissions is required
- :guilabel:`password`, Password to access the console
- :guilabel:`usernameAdmin`, The user name to access the management
platform, a user with the operation authority of the management
platform is required
- :guilabel:`passwordAdmin`, Password to access the management platform
* :guilabel:`testFiles`, Test files list
The configuration change can be completed by directly modifying
the corresponding value in ``config.yaml``
You can also complete configuration changes through ``local_config.yaml``
- Copy ``test/e2e/config/config.yaml`` to ``test/e2e/config/local_config.yaml``
- Modify the corresponding variables in ``local_config.yaml``
- For the value of the variable, the priority is: ``local_config.yaml`` > ``config.yaml``
#. Command line run E2E
.. code-block:: console
yarn run test:e2e
#. GUI running E2E
.. code-block:: console
yarn run test:e2e:open
#. E2E test results
After the test run is over, visit ``test/e2e/report/merge-report.html`` to view
#. E2E Code coverage test results
After the test run is over, visit ``coverage/lcov-report/index.html`` to view
.. note::
Code coverage, the front-end package corresponding to ``baseUrl`` that
needs E2E access, is ``dist`` package with a detectable code coverage version
.. code-block:: console
yarn run build:test
The file packaged in the above way is a front-end package with testable
code coverage
Below, the nginx configuration for front-end access to the front-end
package with code coverage function is given
.. code-block:: nginx
server {
listen 0.0.0.0:8088 default_server;
root /path/to/skyline-console/dist;
index index.html;
server_name _;
location / {
try_files $uri $uri/ /index.html;
}
location /api {
proxy_pass http://<backend_address>;
}
}
Unit test
----------
#. Command line run unit tests
.. code-block:: console
yarn run test:unit
#. Unit test results
You can view the running results directly in the command line console