Hello everyone, everyone should be attracted to click in by such a wonderful title. Now that you are here, please read on with me. Make sure you don’t waste these few minutes (even if it is wasted, it will give you something different. thoughts), let’s not talk nonsense, everyone, sit tight, fasten your seat belts, and start the car! ! !
Source of inspiration
First of all, let me briefly introduce myself. I am actually a relatively good front-end developer, or I am not satisfied with the status quo (web development). I usually like to develop some weird development tools, or learn some cross-end development (electron) ,Develop a chrome plug-in, like to learn skills other than development, automated testing, etc. After a while of tossing around, I still do nothing, have no major achievements, and continue to do my job to support myself. It’s all for these taels of silver,
Suddenly one day, I had a flash of inspiration and did the ete test. Although it can guarantee the stability of the project, its disadvantage is that it requires learning costs to get started, and the maintenance cost is relatively high. Every time the Id of a page is modified, it may lead to the entire automation. The script needs to be rewritten, which is why it is difficult to do automated testing. Automation can only be played by a large factory (the father of the gold master). It is good that a small factory can have enough development (more Or even develop and test by yourself). (Disclaimer: The above is just a personal opinion, if there is any mistake, it is purely the author’s misjudgment)
Record test script
I just thought why can’t we automate the recording of scripts? I checked the automated testing tools on the market and found that Selenium can automatically record scripts, but Selenium cannot make assertions. You still need to understand the code and add assertions manually. Although there are, it still cannot satisfy the customization without code. The cost of testing scenarios is still quite high, so I wondered whether the chrome plug-in can record the operation scenarios of each step. As for the assertion, you can select the assertion condition through the right-click menu of the mouse. If this is the case, is there no need to modify the test case? Based on this idea, I started to verify, through js injection to monitor mouse operation events globally, obtain user operations, and then generate a simpler json file from the recorded script. You only need to understand the meaning of each key to modify the script. Isn’t it super easy! If you still don’t understand the code, it’s okay, just delete the previous test script and record it again, it won’t waste too much time, so easy!
Code snippet
[
{
"active": true,
"audible": false,
"autoDiscardable": true,
"discarded": false,
"favIconUrl": "https://www.baidu.com/img/baidu_85beaf5496f291521eb75ba38eacbd87.svg",
"groupId": -1,
"height": 750,
"highlighted": true,
"id": 83924930,
"incognito": true,
"index": 0,
"mutedInfo": {
"muted": false
},
"pinned": false,
"selected": true,
"status": "complete",
"title": "Baidu, you will know",
"url": "https://www.baidu.com/",
"width": 1511,
"windowId": 83924929,
"action": "start",
"indexNum": 0,
"date": 1683204259189,
"userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Safari/537.36",
"isMobile": false,
"hasTouch": false,
"deviceScaleFactor": 2,
"type": "start"
},
{
"x": 428.5,
"y": 188.3984375,
"url": "https://www.baidu.com/",
"date": 1683204265653,
"height": 44,
"xpath": "//*[@id="kw"]",
"width": 550,
"value": "",
"clientX": 767,
"clientY": 204,
"selector": "document > html > body > div > div > div > div > div > form > span > input",
"iframe": "",
"indexNum": 1,
"innerHtml": "",
"localName": "input",
"localNameType": "text",
"type": "click"
},
{
"x": 135,
"y": 17,
"url": "https://www.baidu.com/",
"date": 1683204275609,
"height": 38,
"xpath": "//*[@id="kw"]",
"width": 471,
"value": "Hello",
"clientX": 533,
"clientY": 38,
"selector": "document > html > body > div > div > div > div > div > form > span > input",
"iframe": "",
"indexNum": 3,
"innerHtml": "",
"localName": "input",
"localNameType": "text",
"type": "change"
},
{
"x": 725,
"y": 15,
"url": "https://www.baidu.com/",
"date": 1683204275760,
"height": 40,
"xpath": "//*[@id="su"]",
"width": 112,
"value": "Baidu look",
"clientX": 799,
"clientY": 23,
"selector": "document > html > body > div > div > div > div > div > form > span > input",
"iframe": "",
"indexNum": 4,
"innerHtml": "",
"localName": "input",
"localNameType": "submit",
"type": "click"
}
]
Author: Happy Scavengers
Link: https://juejin.cn/post/7229587772217327671
Source: Rare Earth Nuggets
Copyright belongs to the author. For commercial reprint, please contact the author for authorization, for non-commercial reprint, please indicate the source.
key
Did you suddenly feel that it is very simple, and you can implement an automated testing tool yourself? I was deceived by this illusion. It is not difficult to realize the script recording function. The difficult thing is how to realize the customized test playback function? How to do it out of the box (cross-end)? How to solve the problem of nested iframe search dom? How to store the script? How are test results generated? A series of big questions. . . . In order to realize this naive idea, I also went crazy. As long as it is not business development, I like to specialize in research. Who made me a front-end developer who is not doing business properly?
Automated testing
After the test script is recorded, how to run the automated test? This is a problem. Although it is not difficult, we don’t want to use too much troublesome startup method. In order to meet this condition, we need to develop an out-of-the-box tool that supports cross-end. Speaking of which, electron seems to be a good choice. Then My previous idleness seems to have come in handy, so let’s develop an automated testing tool based on electron. Just import the test script into the tool and click a button to run the automated test. Do you feel that the automated test is so simple and the generated test? The report allows you to see the test results at a glance. In order to facilitate the maintenance of test case scripts, the tool supports drag-and-drop, grouping, single-selection and other functions, which is convenient for you to test as you like. If you still want to push messages, it doesn’t matter. You can pass Configure Feishu and DingTalk message push to ensure that you can grasp the test status anytime, anywhere. Even if your online project is running normally, you can also automate it through scheduled tasks. It is not bad as an online project monitoring platform! ! !
Test Playback Flowchart
Through the test script traversal operation, simulate the playback of ‘click’, ‘text box change’, ‘mouse scroll’, ‘forward’, ‘backward’, ‘refresh’, ‘tap of the browser for the type type of each test case Page switching’ and other operations can achieve the results of test automation. Finally, the collected test result information is summarized to generate a test report, and the automated test results are achieved. It seems to be quite interesting to implement.
Automation tool interface
If there is a beautiful test interface, is it more pleasing to test? I still have to find a beautiful UI lady to help design one (is there a chance to communicate with the lady), and there will be a prototype of the test automation tool. The ugly interface is not the fault of the UI lady, it is the development and implementation It’s not good.
Summary
An automated testing tool is realized in this way. It seems simple, but it is also simple to implement. It has been done for two years (the technology is still too bad). In order to achieve better functions, I worked overtime and stayed up overnight. I have seen Shanghai at 4 o’clock in the morning, and heard the birds chirping early in the morning. The skills I have learned for so many years without doing business are finally fully reflected in a project. For the first time, I feel a sense of accomplishment other than development. , will be reflected one day. If the front end can’t sit still that day, I believe that we should be able to grab a bite of food in terms of testing, right
There are still many functions that have not been expanded one by one, such as global configuration, advanced configuration, and expansion capabilities… I will give you a chance to experience the fun of exploration Fun link eTest, and everyone is welcome to give a star,? ?If you have an idea, you can leave a message, and you must reply as soon as possible
Finally: In order to give back to the hard-core fans, I have compiled a complete software testing video learning tutorial for you. If you need it, you can get it for free 【Guaranteed 100% free 】
Software testing interview document
We must study to find a high-paying job. The following interview questions are the latest interview materials from first-tier Internet companies such as Ali, Tencent, and Byte, and some Byte bosses have given authoritative answers. Finish this set The interview materials believe that everyone can find a satisfactory job.
We must study to find a high-paying job. The following interview questions are the latest interview materials from first-tier Internet companies such as Alibaba, Tencent, and Byte, and some Byte bosses have given authoritative answers. Answer, After reviewing this set of interview materials, I believe everyone can find a satisfactory job.
How to obtain a full set of information:
