feat: added e2e test for Login page

[LiteSun]

Please answer these questions before submitting a pull request

• Why submit this pull request?

• Bugfix

• New feature provided

• Improve performance

• Related issues
  proposal: UI autotest #614
  resolved test: add e2e test for Login & Logout #645

---

Bugfix

• Description

• How to fix?

---

New feature or improvement

• Describe the details and related test reports.
  as title

[juzhiyuan]

Your CI failed because of License issues, fix them first.

[moonming]

this PR has a big title, will you add all e2e test cases in this PR?

[liuxiran]

just a proposal：define the dom selectors and test datas separately as variables, It may be better to maintain later.

A test case for a page contains three parts, domselectors, test datas, and test steps.

• The domselectors maybe changed as the layout of the page changed or UI frame changed;
• Test datas are also likely to change when data source changed;
• The test steps are relatively stable

e.g:

const domSelectors = {
    inputUserName: '#control-ref_username',
    inputPassWord: '#control-ref_password',
    buttonLogin: '.ant-btn-lg',
    notificationLogin: '.ant-notification-notice-description',
    ...
};
const loginFailedDatas = {
    userName: 'admin',
    passWord: '123456'
};
const loginSuccessDatas = {
   userName: 'admin',
   passWord: 'admin'
};

[LiteSun]

just a proposal：define the dom selectors and test datas separately as variables, It may be better to maintain later.

A test case for a page contains three parts, domselectors, test datas, and test steps.

• The domselectors maybe changed as the layout of the page changed or UI frame changed;
• Test datas are also likely to change when data source changed;
• The test steps are relatively stable

e.g:

const domSelectors = {
    inputUserName: '#control-ref_username',
    inputPassWord: '#control-ref_password',
    buttonLogin: '.ant-btn-lg',
    notificationLogin: '.ant-notification-notice-description',
    ...
};
const loginFailedDatas = {
    userName: 'admin',
    passWord: '123456'
};
const loginSuccessDatas = {
   userName: 'admin',
   passWord: 'admin'
};

I couldn't agree with you more and will update soon.

[juzhiyuan]

Please update the destination branch to v2.0 ASAP to prevent a lot of conflicts.

[idbeta]

It’s really a good example. It’s better if there is a public function for logging in.
For other test cases, just calling it is equivalent to logging in to the dashboard.

[membphis]

How about we use makefile to run test cases? In this way, developers only need to know the entry of make.

We can implement this separately later.

[LiteSun]

How about we use makefile to run test cases? In this way, developers only need to know the entry of make.

We can implement this separately later.

Good idea, but I'm not familiar with makefile and need time to research it. If that's OK, I'll use it in the future.

[membphis]

here is an example of APISIX, you can take a look: https://github.com/apache/apisix/blob/master/Makefile#L70

[moonming]

you can refer to https://github.com/apache/apisix/blob/master/Makefile Thanks, Ming Wen Twitter: _WenMing litesun <notifications@github.com> 于2020年11月2日周一 下午2:43写道：

…

***@***.**** commented on this pull request. ------------------------------ In frontend/src/e2e/README.md <#619 (comment)> : > +# http://www.apache.org/licenses/LICENSE-2.0 +# +# Unless required by applicable law or agreed to in writing, software +# distributed under the License is distributed on an "AS IS" BASIS, +# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +# See the License for the specific language governing permissions and +# limitations under the License. +# +--> + +### Writing test cases + +1. Install dependencies then run in development mode + +```sh +$ yarn install && yarn start How about we use makefile to run test cases? In this way, developers only need to know the entry of make. We can implement this separately later. Good idea, but I'm not familiar with makefile and need time to research it. If that's OK, I'll use it in the future. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#619 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AGJZBKY2ANV2XMA5AUN3ZZ3SNZIIJANCNFSM4TDCRUBA> .

[juzhiyuan]

Just a better-format comment, not request changes.

[juzhiyuan]

[membphis]

md style: need a blank line before and after the title

[juzhiyuan]

Typo!

[membphis]

here is an example of APISIX, you can take a look: https://github.com/apache/apisix/blob/master/Makefile#L70

[juzhiyuan]

After the markdown files get lint then we could merge this PR.

Let's send another PR to improve the Make command.

[juzhiyuan]

disharmony IMO

[juzhiyuan]

Typo!

[juzhiyuan]

Just modified some typos & request changes.

[juzhiyuan]

I'm going to merge this because I see there have no other comments except improving Makefile.

[juzhiyuan]

Just added a tracking issue about Makefile #670