From c069ce5aaf68a04e83359c8b869a515bbb3f5885 Mon Sep 17 00:00:00 2001 From: yangshaoxue Date: Thu, 8 Sep 2022 18:12:07 +0800 Subject: [PATCH] docs: add development guide add development guide Change-Id: Id8fcac77eb5691e297f99cfe845c1b53bf1709bf --- .../development/catalog-introduction.rst | 344 ++++++++++++++++++ doc/source/development/ready-to-work.rst | 119 ++++++ doc/source/test/catalog-introduction.rst | 176 ++++----- doc/source/test/how-to-edit-e2e-case.rst | 136 +++---- 4 files changed, 624 insertions(+), 151 deletions(-) diff --git a/doc/source/development/catalog-introduction.rst b/doc/source/development/catalog-introduction.rst index bb14fdaa..0f539823 100644 --- a/doc/source/development/catalog-introduction.rst +++ b/doc/source/development/catalog-introduction.rst @@ -1,2 +1,346 @@ Catalog Introduction ~~~~~~~~~~~~~~~~~~~~ + +Introduction to the first-level directory +----------------------------------------- + +- :guilabel:`Gruntfile.js`: Used to collect i18n + +- :guilabel:`LICENSE`: This project uses Apache License + +- :guilabel:`Makefile` + +- :guilabel:`README.rst`: A brief description of the front-end startup, + please refer to the docs for details + +- :guilabel:`config`: webpack configuration, which contains webpack + configuration in public, development environment, test environment, + and build environment + +- :guilabel:`cypress.json`: E2E test configuration file + +- :guilabel:`docker`: Contains the docker configuration used in the + development environment, generation environment, and test environment + +- :guilabel:`docs`: Documentation introduction, including Chinese, English, + development documentation, testing documentation + +- :guilabel:`jest.config.js`: Unit test configuration file + +- :guilabel:`jsconfig.json`: javascript code configuration file + +- :guilabel:`package.json`: Configuration files such as installation + packages and commands + +- :guilabel:`yarn.lock`: The version lock file of the package + +- :guilabel:`.babelrc`: Babel configuration file + +- :guilabel:`.dockerignore`: File configuration ignored by docker + +- :guilabel:`.eslintignore`: File configuration ignored by eslint + +- :guilabel:`.eslint`: Eslint configuration + +- :guilabel:`.gitignore`: File configuration ignored by git + +- :guilabel:`.gitreview`: Gitreview configuration + +- :guilabel:`.prettierignore`: File configuration ignored by prettier + +- :guilabel:`.prettierrc`: Prettier configuration + +- :guilabel:`src`: **The folder where the development code is located** + +- :guilabel:`test`: **The folder where the test code is located, + contains e2e test code and basic code for unit testing** + +- :guilabel:`tools`: Other tools folder, containing git tools + +Catalog Introduction-Image Version +----------------------------------- + +.. code-block:: text + + . + ├── Gruntfile.js (Used to collect i18n) + ├── LICENSE + ├── Makefile + ├── README.rst + ├── config + │   ├── theme.js + │   ├── webpack.common.js + │   ├── webpack.dev.js (Webpack configuration used during development) + │   ├── webpack.e2e.js (The webpack configuration used during e2e testing can generate a package for testing coverage) + │   └── webpack.prod.js (Webpack packaging configuration used by the generation environment) + ├── cypress.json (E2E configuration) + ├── docker + │   ├── dev.dockerfile + │   ├── nginx.conf + │   ├── prod.dockerfile + │   └── test.dockerfile + ├── docs (Documents) + ├── jest.config.js (Unit testing configuration) + ├── jsconfig.json + ├── package.json + ├── src + │   ├── api (Api summary, not used yet) + │   ├── asset + │   │   ├── image (Images placement) + │   │   └── template + │   │   └── index.html + │   ├── components (Public components) + │   ├── containers + │   │   ├── Action + │   │   │   ├── ConfirmAction (Confirmed action base class) + │   │   │   ├── FormAction (Single page action base class) + │   │   │   ├── ModalAction (Pop-up action base class) + │   │   │   ├── StepAction (Multi-step single-page action, for example: create a cloud host) + │   │   │   └── index.jsx + │   │   ├── BaseDetail (Detail page base class with detailed information) + │   │   ├── List (The base class of the list page, for example: cloud host) + │   │   ├── TabDetail (The base class of the detail page with tab switching, for example: instance details) + │   │   └── TabList (List page with tab switch) + │   ├── core + │   │   ├── App.jsx + │   │   ├── i18n.js + │   │   ├── index.jsx (Entry) + │   │   └── routes.js (Routing configuration by module) + │   ├── layouts + │   │   ├── Base (Layout used after login) + │   │   ├── Blank (Blank layout) + │   │   ├── User (Layout used for login) + │   │   ├── admin-menu.jsx (Menu configuration used by the management platform) + │   │   └── menu.jsx (Menu configuration used by the console) + │   ├── locales (Translation) + │   │   ├── en.json + │   │   ├── index.js + │   │   └── zh.json + │   ├── pages (The page-directory structure is assigned according to: menu item-secondary menu, where the pages of the secondary menu are placed in the containers folder) + │   │   ├── base + │   │   │   ├── App.jsx + │   │   │   ├── containers + │   │   │   │   ├── 404 (404 page) + │   │   │   │   │   └── index.jsx + │   │   │   │   ├── AdminOverview (Management platform home page) + │   │   │   │   │   ├── components + │   │   │   │   │   │   ├── ComputeService.jsx + │   │   │   │   │   │   ├── NetworkService.jsx + │   │   │   │   │   │   ├── PlatformInfo.jsx + │   │   │   │   │   │   ├── ResourceOverview.jsx + │   │   │   │   │   │   └── VirtualResource.jsx + │   │   │   │   │   ├── index.jsx + │   │   │   │   │   └── style.less + │   │   │   │   └── Overview (Console home page) + │   │   │   │   ├── components + │   │   │   │   │   ├── ProjectInfo.jsx + │   │   │   │   │   ├── QuotaOverview.jsx + │   │   │   │   │   └── ResourceStatistic.jsx + │   │   │   │   ├── index.jsx + │   │   │   │   └── style.less + │   │   │   └── routes (Routing configuration) + │   │   │   └── index.js + │   │   ├── compute + │   │   │   ├── App.jsx + │   │   │   ├── containers + │   │   │   │   ├── BareMetalNode (Bare metal configuration) + │   │   │   │   ├── Flavor (Instance type) + │   │   │   │   ├── HostAggregate (Host Aggregate) + │   │   │   │   │   ├── Aggregate (Host Aggregate) + │   │   │   │   │   ├── AvailabilityZone (Availability zone) + │   │   │   │   │   └── index.jsx + │   │   │   │   ├── Hypervisors (Hypervisors management) + │   │   │   │   │   ├── ComputeHost (Compute host) + │   │   │   │   │   ├── Hypervisor (Hypervisor manager) + │   │   │   │   │   └── index.jsx + │   │   │   │   ├── Image (Image) + │   │   │   │   ├── Instance (Instance) + │   │   │   │   │   ├── Detail (Detail page) + │   │   │   │   │   │   ├── BaseDetail (Base info) + │   │   │   │   │   │   ├── SecurityGroup (Security group) + │   │   │   │   │   │   └── index.jsx + │   │   │   │   │   ├── actions (Actions) + │   │   │   │   │   │   ├── AssociateFip.jsx (Associate fip ip) + │   │   │   │   │   │   ├── AttachInterface.jsx (Attach interface) + │   │   │   │   │   │   ├── AttachIsoVolume.jsx (Attach iso volume) + │   │   │   │   │   │   ├── AttachVolume.jsx (Attach volume) + │   │   │   │   │   │   ├── ChangePassword.jsx (Change password) + │   │   │   │   │   │   ├── Console.jsx (Console) + │   │   │   │   │   │   ├── CreateImage.jsx (Create Image) + │   │   │   │   │   │   ├── CreateIronic (Create ironic-Step-by-step Form) + │   │   │   │   │   │   │   ├── BaseStep + │   │   │   │   │   │   │   │   └── index.jsx + │   │   │   │   │   │   │   ├── ConfirmStep + │   │   │   │   │   │   │   │   └── index.jsx + │   │   │   │   │   │   │   ├── NetworkStep + │   │   │   │   │   │   │   │   └── index.jsx + │   │   │   │   │   │   │   ├── SystemStep + │   │   │   │   │   │   │   │   └── index.jsx + │   │   │   │   │   │   │   ├── index.jsx + │   │   │   │   │   │   │   └── index.less + │   │   │   │   │   │   ├── CreateSnapshot.jsx (Create snapshot) + │   │   │   │   │   │   ├── Delete.jsx (Delete instance) + │   │   │   │   │   │   ├── DeleteIronic.jsx (Delete ironic) + │   │   │   │   │   │   ├── DetachInterface.jsx (Detach interface) + │   │   │   │   │   │   ├── DetachIsoVolume.jsx (Detach iso volume) + │   │   │   │   │   │   ├── DetachVolume.jsx (Detach volume) + │   │   │   │   │   │   ├── DisassociateFip.jsx (Disassociate fip iP) + │   │   │   │   │   │   ├── Edit.jsx (Edit instance) + │   │   │   │   │   │   ├── ExtendRootVolume.jsx (Expand the root disk) + │   │   │   │   │   │   ├── LiveMigrate.jsx (Live migrate) + │   │   │   │   │   │   ├── Lock.jsx (Lock instance) + │   │   │   │   │   │   ├── ManageSecurityGroup.jsx (Manage security group) + │   │   │   │   │   │   ├── Migrate.jsx (Migrate) + │   │   │   │   │   │   ├── Pause.jsx (Pause instance) + │   │   │   │   │   │   ├── Reboot.jsx (Reboot instance) + │   │   │   │   │   │   ├── Rebuild.jsx (Rebuild instance) + │   │   │   │   │   │   ├── RebuildSelect.jsx (Select the image to rebuild the instance) + │   │   │   │   │   │   ├── Resize.jsx (Change configuration) + │   │   │   │   │   │   ├── ResizeOnline.jsx (Modify configuration online) + │   │   │   │   │   │   ├── Resume.jsx (Resume instance) + │   │   │   │   │   │   ├── Shelve.jsx (Shelve instance) + │   │   │   │   │   │   ├── SoftDelete.jsx (Soft delete instance) + │   │   │   │   │   │   ├── SoftReboot.jsx (Soft reboot instance) + │   │   │   │   │   │   ├── Start.jsx (Start instance) + │   │   │   │   │   │   ├── StepCreate (Create a instance-step by step creation) + │   │   │   │   │   │   │   ├── BaseStep + │   │   │   │   │   │   │   │   └── index.jsx + │   │   │   │   │   │   │   ├── ConfirmStep + │   │   │   │   │   │   │   │   └── index.jsx + │   │   │   │   │   │   │   ├── NetworkStep + │   │   │   │   │   │   │   │   └── index.jsx + │   │   │   │   │   │   │   ├── SystemStep + │   │   │   │   │   │   │   │   └── index.jsx + │   │   │   │   │   │   │   ├── index.jsx + │   │   │   │   │   │   │   └── index.less + │   │   │   │   │   │   ├── Stop.jsx (Stop instance) + │   │   │   │   │   │   ├── Suspend.jsx (Suspend instance) + │   │   │   │   │   │   ├── Unlock.jsx (Unlock instance) + │   │   │   │   │   │   ├── Unpause.jsx (Unpause instance) + │   │   │   │   │   │   ├── Unshelve.jsx (Unshelve instance) + │   │   │   │   │   │   ├── index.jsx + │   │   │   │   │   │   └── index.less + │   │   │   │   │   ├── components (Component) + │   │   │   │   │   │   ├── FlavorSelectTable.jsx + │   │   │   │   │   │   └── index.less + │   │   │   │   │   ├── index.jsx + │   │   │   │   │   └── index.less + │   │   │   │   ├── Keypair (Key pair) + │   │   │   │   └── ServerGroup (Instance group) + │   │   │   └── routes (Routing configuration under the compute menu) + │   │   │   └── index.js + │   │   ├── configuration (Platform configuration) + │   │   │   ├── App.jsx + │   │   │   ├── containers + │   │   │   │   ├── Metadata (Metadata definition) + │   │   │   │   ├── Setting (System configuration) + │   │   │   │   └── SystemInfo (System info) + │   │   │   └── routes (Routing configuration under the platform configuration menu) + │   │   │   └── index.js + │   │   ├── heat (Resource orchestration) + │   │   │   ├── App.jsx + │   │   │   ├── containers + │   │   │   │   └── Stack (Stack) + │   │   │   └── routes (Routing configuration under the resource arrangement menu) + │   │   │   └── index.js + │   │   ├── identity (Identity management) + │   │   │   ├── App.jsx + │   │   │   ├── containers + │   │   │   │   ├── Domain (Domain) + │   │   │   │   ├── Project (Project) + │   │   │   │   ├── Role (Role) + │   │   │   │   ├── User (User) + │   │   │   │   └── UserGroup (User group) + │   │   │   └── routes (Routing configuration) + │   │   │   └── index.js + │   │   ├── management (Operation and maintenance management) + │   │   │   ├── App.jsx + │   │   │   ├── containers + │   │   │   │   └── RecycleBin (Recycle bin) + │   │   │   └── routes (Routing configuration) + │   │   │   └── index.js + │   │   ├── network (Network) + │   │   │   ├── App.jsx + │   │   │   ├── containers + │   │   │   │   ├── FloatingIp (Floating ip) + │   │   │   │   ├── LoadBalancers (Load balancing) + │   │   │   │   ├── Network (Network) + │   │   │   │   ├── QoSPolicy (Qos policy) + │   │   │   │   ├── Router (Routing) + │   │   │   │   ├── SecurityGroup (Security group) + │   │   │   │   ├── Topology (Network topology) + │   │   │   │   ├── VPN (VPN) + │   │   │   │   └── VirtualAdapter (Virtual Adapter) + │   │   │   └── routes (Routing configuration) + │   │   │   └── index.js + │   │   ├── storage (Storage) + │   │   │   ├── App.jsx + │   │   │   ├── containers + │   │   │   │   ├── Backup (Backup) + │   │   │   │   ├── Snapshot (Volume snapshot) + │   │   │   │   ├── Storage (Storage backend) + │   │   │   │   ├── Volume (Volume) + │   │   │   │   └── VolumeType (Volume type) + │   │   │   │   ├── QosSpec (QoS) + │   │   │   │   ├── VolumeType (Volume type) + │   │   │   │   └── index.jsx + │   │   │   └── routes () + │   │   │   └── index.js + │   │   └── user (Login page) + │   │   ├── App.jsx + │   │   ├── containers + │   │   │   ├── ChangePassword (Change password-according to system configuration) + │   │   │   │   ├── index.jsx + │   │   │   │   └── index.less + │   │   │   └── Login (Login) + │   │   │   ├── index.jsx + │   │   │   └── index.less + │   │   └── routes (Routing configuration) + │   │   └── index.js + │   ├── resources (Store the public functions and status of each resource used by itself) + │   ├── stores (Data processing, divide folders by resource type) + │   │   ├── base-list.js (Base class for list data) + │   │   ├── base.js (Base class for data manipulation) + │   │   ├── cinder + │   │   ├── glance + │   │   ├── heat + │   │   ├── ironic + │   │   ├── keystone + │   │   ├── neutron + │   │   ├── nova + │   │   ├── octavia + │   │   ├── overview-admin.js + │   │   ├── project.js + │   │   ├── root.js + │   │   └── skyline + │   ├── styles (Public styles) + │   │   ├── base.less + │   │   ├── main.less + │   │   ├── reset.less + │   │   └── variables.less + │   └── utils (Public functions) + │   ├── RouterConfig.jsx + │   ├── constants.js + │   ├── cookie.js + │   ├── file.js + │   ├── file.spec.js + │   ├── index.js + │   ├── index.test.js (Unit testing) + │   ├── local-storage.js + │   ├── local-storage.spec.js (Unit testing) + │   ├── request.js + │   ├── table.jsx + │   ├── time.js + │   ├── time.spec.js + │   ├── translate.js + │   ├── translate.spec.js + │   ├── validate.js + │   ├── yaml.js + │   └── yaml.spec.js + ├── test + │   ├── e2e (E2E testing) + │   └── unit (Unit testing) + ├── tools + │   └── git_config + │   └── commit_message.txt + └── yarn.lock diff --git a/doc/source/development/ready-to-work.rst b/doc/source/development/ready-to-work.rst index 85ff2352..0b8078c5 100644 --- a/doc/source/development/ready-to-work.rst +++ b/doc/source/development/ready-to-work.rst @@ -1,2 +1,121 @@ Ready To Work ~~~~~~~~~~~~~~ + +For more information about installation, refer to the :ref:`source-install-ubuntu` + +Preparation before development +------------------------------ + +- Node environment + + - Requirement in package.json: ``"node": ">=10.22.0"`` + - Verify nodejs version + + .. code-block:: console + + node -v + +- Yarn + + - 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 + +- Prepare a usable backend + + - Prepare an accessible backend, for example: ``https://172.20.154.250`` + + - Modify the corresponding configuration in ``config/webpack.dev.js``: + + .. code-block:: javascript + + if (API === 'mock' || API === 'dev') { + devServer.proxy = { + '/api': { + target: 'https://172.20.154.250', + changeOrigin: true, + secure: false, + }, + }; + } + +- Configure access host and port + + - Modify :guilabel:`devServer.host` and :guilabel:`devServer.port` + + - Modify the corresponding configuration in ``config/webpack.dev.js`` + + .. code-block:: javascript + + const devServer = { + host: '0.0.0.0', + // host: 'localhost', + port: 8088, + contentBase: root('dist'), + historyApiFallback: true, + compress: true, + hot: true, + inline: true, + disableHostCheck: true, + // progress: true + }; + +- Completed + + - Execute in the project root directory, which is the same level + as ``package.json`` + + .. code-block:: console + + yarn run dev + + - Use the :guilabel:`host` and :guilabel:`port` configured in + ``config/webpack.dev.js`` to access, such as ``http://localhost:8088`` + + - The front-end real-time update environment used for development is done. + +Front-end package used in production environment +------------------------------------------------ + +Have the required ``nodejs`` and ``yarn`` + +Execute in the project root directory, which is the same level +as ``package.json`` + +.. code-block:: console + + yarn run build + +The packaged files are in the ``dist`` directory and handed over +to the deployment personnel. + +Front-end package used for testing +----------------------------------- + +Have the required ``nodejs`` and ``yarn`` + +Execute in the project root directory, which is the same level +as ``package.json`` + +.. code-block:: console + + yarn run build:test + +The packaged files are in the ``dist`` directory + +.. note:: + + This test package is designed to measure code coverage + + It is recommended to use nginx to complete the E2E test with code coverage diff --git a/doc/source/test/catalog-introduction.rst b/doc/source/test/catalog-introduction.rst index 90542461..38878b13 100644 --- a/doc/source/test/catalog-introduction.rst +++ b/doc/source/test/catalog-introduction.rst @@ -1,99 +1,99 @@ Catalog Introduction ~~~~~~~~~~~~~~~~~~~~ - .. code-block:: text +.. 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) + 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 +E2E test code, stored in the ``test/e2e`` directory - - Other global configurations of E2E are stored in ``cypress.json`` +- Other global configurations of E2E are stored in ``cypress.json`` -#. The basic code of the unit test is stored in the ``test/unit`` directory +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`` +- 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`` +- 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/index.js`` and ``src/utils/index.test.js`` - - case: ``src/utils/local-storage.js`` and ``src/utils/local-storage.spec.js`` + - case: ``src/utils/local-storage.js`` and ``src/utils/local-storage.spec.js`` diff --git a/doc/source/test/how-to-edit-e2e-case.rst b/doc/source/test/how-to-edit-e2e-case.rst index 7b11f945..2e88526d 100644 --- a/doc/source/test/how-to-edit-e2e-case.rst +++ b/doc/source/test/how-to-edit-e2e-case.rst @@ -13,118 +13,128 @@ The following is an introduction, taking the instance use case Generally, when testing the corresponding functions of a resource, follow the following order -#. Prepare relevant variables in text +1. Prepare relevant variables in text +------------------------------------- - - Required parameters when creating a resource, such as: name, password +- Required parameters when creating a resource, such as: name, password - - Required parameters when editing resources, such as: new name +- 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 +- When creating an associated resource, the name of the associated resource, + such as: network name, router name, volume name - .. code-block:: javascript +.. 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}`; + 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 +2. Login before operation +------------------------- - - If you are operating console resources, please use :guilabel:`cy.login` +- If you are operating console resources, please use :guilabel:`cy.login` - - If you are operating administrator resource, please use :guilabel:`cy.loginAdmin` +- 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 +- 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 +.. code-block:: javascript - beforeEach(() => { - cy.login(listUrl); - }); + beforeEach(() => { + cy.login(listUrl); + }); -#. Create associated resources, use the resource creation function provided in - ``resource-commands.js``, take the test instance as an example +3. Create associated resources +------------------------------ - - Create a network for testing to create a instance, attach interface +Create associated resources, use the resource creation function provided in +``resource-commands.js``, take the test instance as an example - .. code-block:: javascript +- Create a network for testing to create a instance, attach interface - cy.createNetwork({ name: networkName }); +.. code-block:: javascript - - Create router :guilabel:`cy.createRouter` to ensure that the - floating IP is reachable when testing the associated floating IP + cy.createNetwork({ name: networkName }); - - The router created in the following way will open the external network - gateway and bind the subnet of the :guilabel:`networkName` network +- Create router :guilabel:`cy.createRouter` to ensure that the + floating IP is reachable when testing the associated floating IP - .. code-block:: javascript + - The router created in the following way will open the external network + gateway and bind the subnet of the :guilabel:`networkName` network - cy.createRouter({ name: routerName, network: networkName }); +.. code-block:: javascript - - Create floating ip :guilabel:`cy.createFip`, - Used to test associate floating ip + cy.createRouter({ name: routerName, network: networkName }); - .. code-block:: javascript +- Create floating ip :guilabel:`cy.createFip`, + Used to test associate floating ip - cy.createFip(); +.. code-block:: javascript - - Create volume :guilabel:`cy.createVolume` (Used to test attach volume) + cy.createFip(); - .. code-block:: javascript +- Create volume :guilabel:`cy.createVolume` (Used to test attach volume) - cy.createVolume(volumeName); +.. code-block:: javascript -#. Write cases for creating resources + cy.createVolume(volumeName); -#. Write use cases for accessing resource details +4. Write cases +-------------- -#. Write use cases corresponding to all operations of resources separately +- 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 +5. delete associated resources +------------------------------- - - Delete Floating IP +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 - .. code-block:: javascript +- Delete Floating IP - cy.deleteAll('fip'); +.. code-block:: javascript - - Delete Router :guilabel:`routerName` + cy.deleteAll('fip'); - .. code-block:: javascript +- Delete Router :guilabel:`routerName` - cy.deleteRouter(routerName, networkName); +.. code-block:: javascript - - Delete Network :guilabel:`networkName` + cy.deleteRouter(routerName, networkName); - .. code-block:: javascript +- Delete Network :guilabel:`networkName` - cy.deleteAll('network', networkName); +.. code-block:: javascript - - Delete Volume :guilabel:`volumeName` + cy.deleteAll('network', networkName); - .. code-block:: javascript +- Delete Volume :guilabel:`volumeName` - cy.deleteAll('volume', volumeName); +.. code-block:: javascript - - Delete all available volume + cy.deleteAll('volume', volumeName); - .. code-block:: javascript +- Delete all available volume - cy.deleteAllAvailableVolume(); +.. code-block:: javascript -The ``4``, ``5``, and ``6`` in the above steps are mainly used + cy.deleteAllAvailableVolume(); + +Reference +---------- - The function operation form in ``test/e2e/support/form-commands.js``, please refer to the detailed introduction