Front-end page testing method, system and equipment and storage medium
By aligning the floating area and matching the dynamic area image of the test map and reference map of the front-end page, the problem of low testing accuracy in the prior art is solved, and more accurate test results are achieved.
Patent Information
- Application Number
- CN202311377918.3
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2023-10-23
- Publication Date
- 2025-05-06
AI Technical Summary
When testing the front-end page, the existing automated testing methods are not very accurate and are prone to BUG false positives.
By obtaining the test map and reference map of the front-end page, floating area alignment and dynamic area image matching and comparison, then similarity detection is performed when the images are matched to generate test results.
Improve the test accuracy, reduce the test false positives, and ensure the accuracy of the test results.
Smart Images

Figure CN119938496A_ABST
Abstract
Description
Technical Field
[0001] The present disclosure relates to the field of automated testing technology, and in particular to a front-end page testing method, system, device and storage medium. Background Art
[0002] Testing the front-end page mainly checks whether the displayed content, component layout, link jump, etc. of the front-end page are correct. At present, the testing methods of the front-end page are mainly divided into two types: manual testing and automated testing. Among them, automated testing can be performed based on snapshot screenshots. In simple terms, after operating the page components of the front-end page, take a screenshot of the front-end page, and perform a similarity test between the captured image and the correct image to determine whether the displayed content of the front-end page is correct.
[0003] However, with the development of technology, the display content of the front-end page is becoming more and more complex. When performing automated testing on the front-end page, false bug reports often occur, and the accuracy of automated testing is not high.
[0004] Therefore, a testing method with higher accuracy is urgently needed. Summary of the invention
[0005] In view of this, the embodiments of the present disclosure provide a front-end page testing method, a front-end page testing system, an electronic device and a computer-readable storage medium, which can improve the testing accuracy.
[0006] The present disclosure provides a method for testing a front-end page, the method comprising:
[0007] Obtaining a test image and a reference image of the front-end page;
[0008] If the test image includes a first floating area and the reference image includes a second floating area, aligning the first floating area with the second floating area;
[0009] If the test image includes a first dynamic area and the reference image includes a second dynamic area, matching and comparing a first image of the first dynamic area with a second image of the second dynamic area;
[0010] When the images of the dynamic areas are matched and the floating areas are aligned, a first similarity detection is performed on the test image and the reference image, and a test result of the test image is generated according to a detection result of the first similarity detection.
[0011] Another aspect of the present disclosure further provides a front-end page testing system, the system comprising:
[0012] An acquisition module, used to acquire a test image and a reference image of the front-end page;
[0013] an alignment module, configured to align the first floating area with the second floating area if the test image includes a first floating area and the reference image includes a second floating area;
[0014] a comparison and matching module, configured to match and compare a first image of the first dynamic area with a second image of the second dynamic area if the test image includes a first dynamic area and the reference image includes a second dynamic area;
[0015] The similarity detection module is used to perform a first similarity detection on the test image and the reference image when the images of the dynamic areas are matched and the floating areas are aligned, and generate a test result of the test image according to the detection result of the first similarity detection.
[0016] Another aspect of the present disclosure further provides a computer-readable storage medium, wherein the computer-readable storage medium is used to store a computer program, and when the computer program is executed by a processor, the method described above is implemented.
[0017] Another aspect of the present disclosure provides an electronic device, which includes a processor and a memory, wherein the memory is used to store a computer program, and when the computer program is executed by the processor, the method described above is implemented.
[0018] In the technical solutions of some embodiments of the present application, before performing a first similarity detection on the test image and the reference image, the first floating area of the test image is aligned with the second floating area of the reference image, and the first dynamic area image of the test image is matched and compared with the second dynamic area image of the reference image, and when the images of the dynamic areas match and the floating areas are aligned, the first similarity detection is performed on the test image and the reference image. In this way, the influence of the misalignment of the floating areas and the change of the content of the dynamic areas on the first similarity detection is avoided, the detection accuracy of the first similarity detection is improved, and the test accuracy of the test image can be improved. BRIEF DESCRIPTION OF THE DRAWINGS
[0019] The features and advantages of the present disclosure will be more clearly understood by referring to the accompanying drawings, which are schematic and should not be construed as limiting the present disclosure in any way. In the accompanying drawings:
[0020] Figure 1 It shows the hierarchical relationship between page elements extracted from the front-end page code;
[0021] Figure 2 A schematic diagram of a test method provided by an embodiment of the present application is shown;
[0022] Figure 3 A schematic diagram of a first floating area and a second floating area provided by an embodiment of the present application is shown;
[0023] Figure 4 A test flow chart of a test chart provided by an embodiment of the present application is shown;
[0024] Figure 5 A module schematic diagram of a test system provided by an embodiment of the present application is shown;
[0025] Figure 6 A schematic diagram of an electronic device provided by an embodiment of the present application is shown. DETAILED DESCRIPTION
[0026] In order to make the purpose, technical solutions and advantages of the embodiments of the present disclosure clearer, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below in conjunction with the drawings in the embodiments of the present disclosure. Obviously, the described embodiments are part of the embodiments of the present disclosure, not all of the embodiments. Based on the embodiments of the present disclosure, all other embodiments obtained by those skilled in the art without creative work are within the scope of protection of the present disclosure.
[0027] Before explaining the solution of this application, the relevant concepts involved in this application are first explained.
[0028] The front-end page refers to the web page displayed to users for browsing or operation. The front-end page may include page elements. Page elements can be tags used to define content in the front-end page, such as title elements used to define titles, table elements used to define tables, form elements used to define input boxes, radio buttons, check boxes, buttons, etc. For example, the following provides a schematic code of a front-end page:
[0029]
[0030]
[0031] In the above code, nodes such as html, head, meta, title, p, div, etc. can be page elements.
[0032] In the same front-end page, page elements can have a hierarchical relationship. For example, see Figure 1 , which is the hierarchical relationship between page elements extracted from the above front-end page code. Figure 1 The structure diagram shown is also called the DOM tree, which represents the hierarchical relationship between page elements. From bottom to top, the page elements at the bottom can have parent nodes. For example Figure 1 , the first parent node of the page element span is the page element p, and the second parent node of the page element span is the page element body.
[0033] Each page element can also include one or more element attributes. Element attributes include, but are not limited to, the data element attribute for customizing data, the id element attribute for defining the page element ID, the class element attribute for defining the page element class name, the tag element attribute for labeling the page element, and the text element attribute for defining the content displayed by the page element. For example, in the above code, the page element meta includes the element attribute charset for defining the character encoding.
[0034] Each element attribute may include two parts: the attribute name and the attribute value. For example, for the element attribute class, it can be expressed as class=xx, where class is the attribute name and xx is the attribute value. For any element attribute A, if the attribute value of element attribute A is the same in different page elements, it can be said that these different page elements have the same element attribute A; if the attribute value of element attribute A is different in different page elements, it can be said that these different page elements have different element attributes A. For example, assuming that in page element 1, its element attribute class=xx1, and in page element 2, its element attribute class=xx2, then it can be said that page element 1 and page element 2 have different class attributes. For another example, assuming that in page element 1, its element attribute class=xx1, and in page element 2, its element attribute class=xx1, then it can be said that page element 1 and page element 2 have the same class attribute. In the subsequent description of this application, if the element attribute A of a page element is different from the element attribute A of other page elements in the front-end page, it is considered that the element attribute A of the page element is unique in the front-end page.
[0035] In addition, the page elements of the front-end page may include a time page element for receiving page operation events. Page operation events include, but are not limited to, page jump, click, stay, input, file upload, etc. For example, when a button is defined using a form element, the form element can be used to receive a click operation event that occurs in the front-end page. For another example, when an input box is defined using a form element, the form element can be used to receive an input operation event that occurs in the front-end page.
[0036] Based on the above description, this application provides a front-end page testing method that can improve test accuracy and reduce test false positives. The testing method can be applied to electronic devices. Electronic devices include but are not limited to tablet computers, laptops, desktop computers, servers, etc. Figure 2 , which is a flow chart of a testing method provided in one embodiment of the present application. Figure 2 The test method includes the following steps:
[0037] Step S31, obtaining the test image and the reference image of the front-end page.
[0038] Specifically, the front-end page can be developed based on an iterative development method. The test image can be an image to be tested obtained from the test version of the front-end page, and the reference image can be an image obtained from the reference version of the front-end page. Among them, the test version can be the current development version of the front-end page, and the reference version can be a tested baseline version of the front-end page (i.e., the first version), or a version that is currently being used by users online (such as the previous version of the current development version). Under normal circumstances, the functions of the test version can be more than those of the reference version. Performing a first similarity test on the test image and the reference image can check whether new problems (i.e., BUGs) are introduced during the iterative development process in addition to the functions that need to be newly developed. If the first similarity test between the test image and the reference image passes, it can be indicated that no new problems are introduced during the development process, and the test for the test image passes; if the first similarity test between the test image and the reference image fails, it can be indicated that new problems are introduced during the development process, and the test for the test image fails.
[0039] In this embodiment, in the baseline version of the front-end page, if the event page element receives a page operation event, the page image of the front-end page can be intercepted as a baseline image, and a test case is generated for the event page element, the test case including a test path for locating the event page element, a baseline image, and a page operation event for the event page element to receive. Furthermore, in the test version of the front-end page, the event page element can be located based on the test path in the test case, and after executing the page operation event on the event page element, the page image of the front-end page can be intercepted as a test image.
[0040] Specifically, for any event page element of the front-end page, when the event page element receives a page operation event for the first time, the page image of the front-end page can be intercepted as the reference image of the event page element, and a test case can be generated for the event page element. The reference image can be a response page image of the front-end page of the reference version for the page operation event. For example, when the event page element used to represent the login confirmation receives a click operation event, the front-end page can display a page indicating a successful login as a response page. Here, the page indicating a successful login as a response page can be the response page image that needs to be intercepted.
[0041] The test path can be characterized by the unique element attributes of the event page element in the front-end page. For example, suppose the element attribute data=dd1 of event page element A. In the front-end page, the element attribute data of other page elements is not equal to dd1, so it can be said that data=dd1 is unique in the front-end page and can be used as the test path of event page element A. When the event page element does not have a unique element attribute in the front-end page, the element attribute of the event page element can be combined with the element attribute of the parent page element according to the hierarchical relationship between the page elements, and the unique element attribute combination can be used as the test path of the event page element. For example, suppose that event page element B does not have a unique element attribute, and the first parent node of event page element B is page element C. The element attribute data=dd1 of event page element B is combined with the element attribute class=cc1 of page element C, and the obtained element attribute combination data=dd1>class=cc1 is unique in the front-end page, so the element attribute combination data=dd1>class=cc1 can be used as the test path of event page element B. For ease of understanding, Table 1 exemplarily provides a test case for one of the event page elements.
[0042] Table 1 Test case
[0043] Event Page Elements Test Path Page operation events Benchmark chart Event page element 1 Test Path 1 Click Benchmarks Figure 1
[0044] Based on the test case in Table 1, in the test version of the front-end page, event page element 1 can be located based on test path 1. After clicking on event page element 1, the page image of the front-end page can be captured as a test image, and then the benchmark image and the test image can be tested for similarity.
[0045] In this embodiment, event page elements are selected from the baseline version of the front-end page, and based on the Monkey test method, event page elements are randomly selected for operation, so that an initial complete test case can be established for the front-end page. Specifically, the following steps may be included:
[0046] 1) Parse the DOM tree and perform preliminary screening of the page elements in the DOM tree, such as filtering out page elements with a size of 0 and filtering invisible page elements.
[0047] 2) Considering that there may be many levels between page elements in the front-end page, which is not conducive to random selection of event page elements, the DOM tree after preliminary screening can be flattened into a list, that is, the element levels in the screened DOM tree can be flattened. Furthermore, the DFS (Depth-First-Search) algorithm can be used to traverse the DOM tree structure obtained after the preliminary screening to screen out event page elements. For the event page elements obtained by screening, their element attribute ID can be recorded in the form of child, and other element attributes (such as class, tag) and the page operation events it is used to receive can be recorded.
[0048] 3) According to the probability of occurrence of each page operation event (also called weight), a weighted random traversal test is performed on the screened event page elements.
[0049] In this way, a complete test case of the front-end page can be obtained from the baseline version of the front-end page, which is similar to what is shown in Table 2.
[0050] Table 2 Test cases
[0051] Event Page Elements Test Path Page operation events Benchmark chart Event page element 1 Test Path 1 Click Benchmarks Figure 1 Event page element 2 Test Path 2 enter Benchmarks Figure 1 …… …… …… …… Event Page Element Test path n enter Benchmark chart
[0052] According to the complete test case shown in Table 2, the corresponding test image can be obtained in the test version of the front-end page, and then the test image can be compared with the benchmark image.
[0053] In this embodiment, after obtaining the test image, a single image detection can be performed on the test image first. Specifically, the single image detection mainly detects whether the test image has black and white anomalies, text overlap, or image loading failure. If so, a test result representing the abnormality of the test image in the test version can be generated; if not, continue to execute steps S32 to S34 to compare the test image with the reference image.
[0054] Step S32: if the test image includes a first floating area and the reference image includes a second floating area, align the first floating area with the second floating area.
[0055] Specifically, the first floating area and the second floating area may be areas manually marked by the tester in the test image and the reference image. The first floating area and the second floating area may include the same content, but the positions of the two areas in the front-end page may be offset. For example, refer to Figure 3 , is a schematic diagram of a first floating area and a second floating area provided in one embodiment of the present application. Figure 3In the example, the second floating area in the reference image is slightly above the first floating area in the test image. This offset may be an image difference that is not perceived by the human eye (i.e., it can be ignored). However, when the reference image and the test image are subjected to the first similarity test, this image difference will affect the first similarity test result, and may cause the first similarity test between the reference image and the test image to fail, thereby generating a false alarm during the automatic test. Therefore, it is necessary to align the first floating area and the second floating area.
[0056] In this embodiment, aligning the first floating area with the second floating area includes:
[0057] The first floating area or the second floating area is used as a target floating area, a first shift is performed on the target floating area for multiple times, and after each first shift, a first similarity score between the test image and the reference image is calculated;
[0058] The total offset of the target floating area when the first similarity score is maximum is determined, and a second offset is performed on the first floating area and / or the second floating area according to the total offset to align the first floating area with the second floating area.
[0059] The total offset is the offset of the target floating area relative to the initial position, and the initial position is the position of the target floating area before the first offset. The unit of the total offset can be pixel, that is, the total number of pixels offset of the target floating area relative to the initial position.
[0060] For easier understanding, please refer to Figure 3 , taking the first floating area as the target floating area as an example.
[0061] In some embodiments, the first floating area can be randomly offset in different directions, for example, the first offset is to the left, and the second offset is to the upper right. In this way, the total offset of the target floating area when the first similarity score between the test image and the reference image is the largest is found. However, this solution requires too many attempts and is not efficient.
[0062] In view of this, in this embodiment, performing a plurality of first shifts on the target floating area may include:
[0063] The target floating area is shifted in different directions, and after shifting in each direction, a second similarity score between the test image and the reference image is calculated;
[0064] The offset direction of the target floating area when the second similarity score is the largest is determined, and the target floating area is first offset multiple times along the offset direction.
[0065] for example Figure 3In the example, the first floating area is shifted to the left, right, upward and downward respectively. It can be understood that when the first floating area is shifted to the left, right and downward, the difference between the test image and the reference image will increase, but when the first floating area is shifted upward, the difference between the test image and the reference image will decrease, that is, when the first floating area is shifted upward, the second similarity score between the test image and the reference image will be the largest. Therefore, the upward direction can be used as the correct shift direction. In this way, invalid attempts in multiple directions are avoided and the shift efficiency is improved.
[0066] Specifically, the first floating area may be shifted upward for multiple times, and the offset of each first shift may be a preset number of pixels, such as two pixels each time. It is understandable that, in the process of the first floating area shifting upward for the first time but not exceeding the dotted line, the first floating area and the second floating area are increasingly aligned, so after each first shift, the calculated first similarity score of the reference image and the test image will become higher and higher. However, as the first floating area exceeds the dotted line, the offset between the first floating area and the second floating area becomes larger and larger, so after each first shift, the calculated first similarity score of the reference image and the test image will become lower and lower. In summary, when the first similarity score of the reference image and the test image is the highest, the total offset of the first floating area is the offset that aligns the first floating area and the second floating area.
[0067] In addition, it can be seen from the above-mentioned first shifting process that after the first similarity score is the largest, the first floating area continues to shift upward, which will only make the difference between the reference image and the test image larger and larger. That is, it is meaningless to continue to shift the first floating area upward. In view of this, a shift threshold (such as 100 pixels) can be set. After the total shift of the first floating area reaches the shift threshold, the first shift is stopped.
[0068] Combined with reference Figure 3 After the total offset is obtained, the first floating area can be aligned with the second floating area by shifting the first floating area from the initial position along the offset direction by the total offset, or by shifting the second floating area in the opposite direction of the offset direction by the total offset. For example, assuming that the total offset is 10 pixels, the first floating area can be aligned with the second floating area by moving the first floating area up by 10 pixels from the initial position, or by moving the second floating area down by 10 pixels.
[0069] In this embodiment, performing a second offset on the first floating area and / or the second floating area according to the total offset includes:
[0070] The floating area as the target floating area is moved by a first offset in the offset direction, and the floating area not as the target floating area is moved by a second offset in the opposite direction of the offset direction, and the sum of the first offset and the second offset is equal to the total offset.
[0071] When the second offset is performed on the target floating area, the target floating area is offset from the starting position. Figure 3 In the example, assuming that the total offset is 10 pixels, the first floating area can be moved up by 5 pixels from the initial position, and the second floating area can be moved down by 5 pixels. In this way, the first floating area and the second floating area can be aligned.
[0072] It can be understood that if only the first floating area in the test image is shifted according to the total offset, or only the second floating area in the reference image is shifted according to the total offset, the change in the test image or the reference image may be relatively large. In this embodiment, the floating areas in the reference image and the test image are shifted in opposite directions. In this way, the problem of excessive change in one of the images can be avoided.
[0073] This completes the explanation of floating area alignment.
[0074] Step S33: if the test image includes the first dynamic area and the reference image includes the second dynamic area, matching and comparing the first image of the first dynamic area with the second image of the second dynamic area.
[0075] The first dynamic area and the second dynamic area can be areas manually marked by the tester, or can be areas marked by the area recognition model after the test image and the reference image are input into the trained area recognition model. The first image and the second image represent images of dynamic content displayed by the dynamic component. The dynamic component can be understood as a page element used to display dynamic content.
[0076] Specifically, in the front-end page, the areas corresponding to the first dynamic area and the second dynamic area are areas where the content can change. For example, take the content change areas such as the time display area and the recommended content display area in the front-end web page as examples. The content in these areas is constantly changing, that is, the content of the content change area is different in the test image and the reference image. When the first similarity detection is performed on the reference image and the test image, the content difference in the content change area will affect the detection result of the first similarity detection, and may cause the similarity detection of the reference image and the test image to fail. However, the content change in the content change area is a normal change, that is, the content change area of the test image and the content change area of the reference image should be considered to be the same. In view of this, when the test image includes the first dynamic area and the reference image includes the second dynamic area, it is necessary to first identify whether the first image of the first dynamic area matches the second image of the second dynamic area.
[0077] In this embodiment, matching and comparing the first image and the second image includes:
[0078] Inputting the first image and the second image into the trained matching model, and using the matching model to identify the category of the first dynamic component corresponding to the first image, and to identify the category of the second dynamic component corresponding to the second image;
[0079] If the category of the first dynamic component is the same as the category of the second dynamic component, it is determined that the first image and the second image match.
[0080] In simple terms, if the content in the first image and the second image is displayed using the same category of dynamic components, even if the first image and the second image are different, the first image and the second image are considered to match. This effectively solves the problem of false positives in tests caused by the dynamic area of the front-end page.
[0081] Furthermore, in order to improve the accuracy of the matching model, after completing the matching comparison of the first image and the second image, the testing method of the present application may further include:
[0082] Displaying the first image, the second image, and a first matching result obtained after matching and comparing the first image and the second image;
[0083] receiving a second matching result input through the human-computer interaction interface indicating whether the first image and the second image match;
[0084] If the first matching result is different from the second matching result, the matching model is trained based on the first image, the second image, and the second matching result.
[0085] Specifically, the first matching result and the second matching result may be results indicating whether the first image and the second image match. The first image, the second image, and the first matching result are displayed through a human-computer interaction interface, and then a tester manually determines whether the first matching result is correct. If the first matching result is incorrect, the tester may input a second matching result different from the first matching result through the human-computer interaction interface, and then the matching model may continue to be trained based on the first image, the second image, and the second matching result, so that the accuracy of the matching model may be continuously improved.
[0086] At this point, the matching and comparison of the dynamic area images is completed.
[0087] Step S34, when the images of the dynamic areas are matched and the floating areas are aligned, a first similarity detection is performed on the test image and the reference image, and test results of the test image and the reference image are generated according to the detection results of the first similarity detection.
[0088] Specifically, the test result of the first similarity test can indicate whether the first similarity test performed on the test image and the reference image passes. The test result can indicate whether the test on the test image passes. If the first similarity test passes, it means that the test on the test image passes; if the first similarity test fails, it means that the test on the test image fails.
[0089] When the first similarity detection is performed on the test image and the reference image, if the matching comparison results of the dynamic areas in the two images are matched, it can be considered that the contents of the two areas are the same or similar. It can be understood that since the offset areas in the test image and the reference image are aligned in step S32, and at the same time, the contents of the dynamic areas are matched and compared in step S33 and the corresponding matching comparison results are obtained, when the first similarity detection is performed on the test image and the reference image, the influence of the offset area and the dynamic area on the first similarity detection can be effectively avoided, thereby improving the accuracy of the test result.
[0090] Furthermore, considering that there may be a difference in brightness between the test image and the reference image that is negligible to the human eye, for example, the test image is brighter than the reference image. These differences in brightness may affect the detection result of the first similarity detection between the test image and the reference image, but these differences in brightness are negligible. In view of this, in this embodiment, performing the first similarity detection on the test image and the reference image may include:
[0091] The light and dark difference between the test image and the reference image is eliminated, and a first similarity detection is performed on the test image and the reference image after the light and dark difference is eliminated.
[0092] In this embodiment, the structural similarity, color similarity and image pixel norm distance of the test image and the reference image can be calculated. If the sum of the structural similarity, image pixel norm distance and color similarity is within the threshold range, it is determined that the first similarity test for the test image and the reference image passes.
[0093] Specifically, the structural similarity of the test image and the reference image can be calculated based on the SSIM algorithm. The structural similarity can be determined by the diff area size and the SSIM score of the SSIM algorithm. If the diff area size is less than the first threshold, and the SSIM score is greater than the second threshold, it is determined that the structural similarity of the test image and the reference image is within the threshold range. If the diff area size is not less than the first threshold, or the SSIM score is not greater than the second threshold, it is determined that the structural similarity of the test image and the reference image is not within the threshold range.
[0094] Specifically, color similarity can be used to characterize the RGB similarity scores of the test image and the reference image. The value of color similarity is less than the third threshold, indicating that the value of color similarity is within the threshold range. Color similarity may not reflect the difference in brightness between the test image and the reference image, that is, the value of color similarity may be the same when the test image and the reference image have brightness differences and when they do not have brightness differences. In this way, the brightness differences that cannot be recognized by the human eye can be ignored, avoiding the influence of these brightness differences on the first similarity detection results of the test image and the reference image, thereby avoiding test false alarms caused by these brightness differences.
[0095] Specifically, the norm distance of image pixels can be used in conjunction with color similarity. Simply put, when performing the first similarity detection on the test image and the reference image, only the difference in light and dark can be ignored in terms of color difference. That is, if there are other color differences between the test image and the reference image in addition to the difference in light and dark, it can be considered that the first similarity detection fails. However, when the difference in light and dark between the test image and the reference image is ignored by color similarity, some test images and reference images with other color differences may be identified as similar images. Therefore, these other color differences can be eliminated by the norm distance of image pixels to ensure that there is only a difference in light and dark between the test image and the reference image. In this way, the test accuracy can be improved.
[0096] In summary, in the technical solutions of some embodiments of the present application, before performing a first similarity detection on the test image and the reference image, the first floating area of the test image is aligned with the second floating area of the reference image, and the first dynamic area image of the test image is matched and compared with the second dynamic area image of the reference image, and when the images of the dynamic areas match and the floating areas are aligned, the first similarity detection is performed on the test image and the reference image. In this way, the influence of the misalignment of the floating areas and the change of the content of the dynamic areas on the first similarity detection is avoided, the detection accuracy of the first similarity detection is improved, and the test accuracy of the test image can be improved.
[0097] Furthermore, in some embodiments, before performing the first similarity detection on the test image and the reference image, the testing method of the present application further includes:
[0098] If the test image includes a first strict area and the reference image includes a second strict area, performing a second similarity test on the image in the first strict area and the image in the second strict area, and performing a first similarity test if the second similarity test passes; and / or
[0099] If the test image includes a first ignored area and the reference image includes a second ignored area, the first ignored area is removed from the test image and the second ignored area is removed from the reference image, and similarity detection is performed on the test image and the reference image after the ignored areas are removed.
[0100] Specifically, the first strict area, the second strict area, the first ignored area, and the second ignored area may all be areas manually demarcated by the tester on the test chart and the reference chart.
[0101] The strict area refers to the area in which the test image and the reference image must be completely consistent. When performing the second similarity detection on the image in the first strict area and the image in the second strict area, the SSIM scores of the image in the first strict area and the image in the second strict area can be calculated based on the hash algorithm. If the SSIM score is not lower than the fourth threshold, it is considered that the second similarity detection on the image in the first strict area and the image in the second strict area has passed.
[0102] The ignore area is an area where the similarity test does not need to be performed when the first similarity test is performed on the test image and the reference image. After the content in the ignore area is cleared from the test image and the reference image, when the first similarity test is performed, the content in the ignore area can be prevented from affecting the first similarity test and reducing the accuracy of the first similarity test.
[0103] See also Figure 4 , which is a test flow chart of a test diagram provided in one embodiment of the present application. Figure 4 Including steps such as:
[0104] Step S51, obtaining a test image and a reference image. For details, please refer to step S31, which will not be described in detail here.
[0105] Step S52, perform a single image test on the test image, that is, detect whether the test image has black and white anomalies, text overlap, image loading, etc. If so, execute step S57 to generate a test result indicating that the test image fails the test; if not, execute step S53.
[0106] Step S53, determining whether the single image test of the test image has passed. If yes, executing step S54; if no, executing step S57, generating a test result indicating that the test image has failed the test.
[0107] Step S54, determine whether there are area configurations in the test image and the reference image, that is, determine whether there are floating areas, strict areas, dynamic areas, and ignore areas in the test image and the reference image. If yes, execute step S55, if not, execute step S56.
[0108] Step S55, determining the area configuration of the test image and the reference image, and performing the following operations:
[0109] 1) In the case of floating areas, align the floating areas in the test chart and the reference chart.
[0110] 2) If there is a strict area, perform a second similarity test on the strict area in the test image and the reference image. If the second similarity test of the strict area fails, execute step S57 to generate a test result indicating that the test image fails the test.
[0111] 3) If there is a dynamic area, the dynamic area in the test image is matched and compared with that in the reference image. If the dynamic area is not matched and compared, step S57 is executed to generate a test result indicating that the test image has not passed the test.
[0112] 4) If an ignore area exists, clear the ignore area.
[0113] When the floating area is aligned, the second similarity check of the strict area is passed, the matching comparison of the dynamic area is passed, and the ignored area is cleared, step S55 is executed.
[0114] Step S56: Perform a first similarity check on the test image and the reference image.
[0115] Step S57: if the first similarity detection passes, a test result is generated indicating that the test image test passes; if the first similarity detection fails, a test result is generated indicating that the test image test fails.
[0116] The following is a further description of the test case in step S31.
[0117] In some embodiments, when generating a test case, the testing method of the present application further includes:
[0118] According to different positioning strategies, multiple candidate paths for positioning event page elements are recorded;
[0119] In the test version of the front-end page, after locating the event page element based on the test path in the test case fails, the method further includes:
[0120] The event page element is relocated through the candidate path, and the test path is repaired based on the actual path of the relocated event page element in the front-end page.
[0121] Specifically, you can pre-select multiple element attributes, and then combine the selected element attributes in different ways to obtain a positioning strategy. A positioning strategy can represent one or more element attributes. Different positioning strategies represent different element attributes. For example, based on the pre-selected element attributes data, ID, class, and tag, you can combine the following 15 positioning strategies:
[0122] Includes 4 positioning strategies for an element attribute: data, ID, class, tag
[0123] Includes 6 positioning strategies for two element attributes: data+ID, data+class, data+tag, ID+class, ID+tag, class+tag
[0124] Includes 4 positioning strategies for three element attributes: data+ID+class, data+ID+tag, data+class+tag, ID+class+tag
[0125] A positioning strategy including four element attributes: data+ID+class+tag
[0126] For any target location strategy, it is possible to determine whether the event page element has a unique target element attribute in the front-end page according to the target element attribute represented by the target location strategy. If so, the unique target element attribute is recorded as a candidate path recorded according to the target location strategy.
[0127] Specifically, for any target element attribute B, if the target element attribute B of the event page element is different from the target element attribute B of other page elements in the front-end page, it can be determined that the target element attribute B of the event page element is unique in the front-end page. For example, assuming that the target positioning strategy is data+ID (i.e., the target element attributes are data and ID), the target element attribute data of the event page element is data=dd1, and the target element attribute ID of the event page element is ID1. If in the front-end page, the target element attribute data of other page elements is not equal to dd1, and there are other page elements whose target element attribute ID is equal to ID1, then it can be considered that the target element attribute data of the event page element is unique in the front-end page, and the target element attribute ID of the event page element is not unique in the front-end page. In this case, the target element attribute data=dd1 of the event page element can be recorded as a candidate path for locating the event page element based on the target positioning strategy.
[0128] It is understandable that, since the recorded target element attribute is unique in the front-end page, the event page element can be uniquely located in the front-end page according to the recorded target element attribute. For example, when the target element attribute data=dd1 of the event page element is unique, after recording data=dd1, the event page element can be uniquely located based on data=dd1.
[0129] Furthermore, if the event page element does not have a unique target element attribute in the front-end page, a unique first target element attribute combination can be found and recorded between the event page element and the parent node of the event page element as a candidate path recorded according to the target positioning strategy. Specifically, the unique first target element attribute combination can be found according to the following steps:
[0130] 1) Combine the target element attributes of the event page element and the first parent node of the event page element to obtain a first target element attribute combination. Each first target element attribute combination obtained here may include one of the target element attributes of the event page element and one of the target element attributes of the first parent node of the event page element.
[0131] If a first target element attribute combination that is unique in the front-end page is found among the obtained first target element attribute combinations, the first target element attribute combination is recorded; if a first target element attribute combination that is unique in the front-end page is not found, step 2) is executed.
[0132] 2) Combining the target element attributes of the event page element, the first parent node of the event page element, and the second parent node of the event page element to obtain a new first target element attribute combination. Each new first target element attribute combination may include one of the target element attributes of the event page element, one of the target element attributes of the first parent node of the event page element, and one of the target element attributes of the second parent node of the event page element.
[0133] If a first target element attribute combination that is unique in the front-end page is found in the new first target element attribute combination, the unique target element attribute combination is recorded; if a first target element attribute combination that is unique in the front-end page is not found in the new first target element attribute combination, continue to execute step 3).
[0134] 3) Combine the target element attributes of the event page element, the first parent node of the event page element, the second parent node of the event page element, and the third parent node of the event page element to continue searching for a unique first target element attribute combination.
[0135] This process is repeated in turn until a unique first target element attribute combination is found.
[0136] For ease of understanding, an example is given to illustrate how to find a unique first target element attribute combination. For example, assuming the target positioning strategy is data+ID (i.e., the target element attributes are data and ID), the first parent node of event page element A is page element B, the second parent node of event page element is page element C, and the target element attributes of event page element A, page element B, and page element C are:
[0137] Event page element A: data = dd1, ID = ID1;
[0138] Page element B: data = dd2, ID = ID2;
[0139] Page element C: data=dd3, ID=ID3.
[0140] Assume that data=dd1 and ID=ID1 are not unique in the front-end page. Then, the target element attributes of event page element A and page element B can be combined to obtain the following first target element attribute combination:
[0141] data=dd1>data=dd2
[0142] data=dd1>ID=ID2
[0143] ID=ID1>data=dd2
[0144] ID=ID1>ID=ID2
[0145] If there is no unique first target element attribute combination among the above first target element attribute combinations, the target element attributes of event page element A, page element B, and page element C are combined to obtain the following new first target element attribute combination:
[0146] data=dd1>data=dd2>data=dd3
[0147] data=dd1>data=dd2>ID=ID3
[0148] data=dd1>ID=ID2>data=dd3
[0149] …
[0150] Assuming that in the above-mentioned new first target element combination, data=dd1>data=dd2>ID=ID3 is unique, data=dd1>data=dd2>ID=ID3 can be recorded as a candidate path for locating event page elements recorded according to the target positioning strategy.
[0151] According to the above principle, according to each positioning strategy, a candidate path for positioning the event page element can be recorded respectively, so that multiple candidate paths are obtained.
[0152] Specifically, in this embodiment, when recording a candidate path, a finder function can be called, and the target element attributes represented by the target positioning strategy are used as input parameters of the finder function. The finder function searches for a unique target element attribute of the event page element, or searches for a unique first target element attribute combination in the event page element and the parent node of the event page element, and returns the found result.
[0153] It should be noted that the candidate path of each event page element may only need to be recorded once. Specifically, the candidate path can generally be recorded for the corresponding event page element when the event page element receives a page operation event for the first time. After recording a candidate path for an event page element, if the event page element subsequently receives a page operation event, there is no need to record a candidate path for the event page element. In other words, when an event page element receives a page operation event, it can first be determined whether a candidate path has been recorded for the event page element. If not, record the candidate path. If so, there is no need to record it again.
[0154] The candidate paths can be saved corresponding to the test cases of the event page elements, which are similar to those shown in Table 3.
[0155] Table 3 Test cases and candidate paths
[0156]
[0157] During the iterative development of the front-end page, if a new page element for receiving page operation events is added to the front-end page, the new page element can be manually selected to generate candidate paths and test records for the new page element. Alternatively, during the iterative testing process, the new page element can be explored through intelligent exploration, and candidate paths and test cases can be generated for the new page element. This allows the new page elements to be tested in subsequent iterative development processes.
[0158] Since the position, color and other element attributes of page elements may change during the iterative development of the front-end page, the test path in the test case may become invalid. For example, in the front-end page, assume that the test path of event page element A is determined by the hierarchical relationship between page elements, and in the test path of event page element A, event page element A is specified as the 5th subordinate node of page element B. However, during the iterative development of the front-end page, the 5th subordinate node and the 3rd subordinate node of page element B are swapped. In this case, the test path of event page element A will become invalid, and event page element A cannot be located based on the test path of event page element A.
[0159] In this embodiment, if the page operation event corresponding to the event page element can be executed on the page element located based on the test path, it means that the event page element is successfully located; if the page operation event corresponding to the event page element cannot be executed on the page element located based on the test path, it means that the event page element has failed to be located. For example, in Table 1, test path 1 based on event page element A locates page element B, and page element B may be event page element A or may not be event page element A. At this time, if a click operation can be performed on page element B, it can be indicated that page element B is event page element A, that is, event page element A is successfully located; if a click operation cannot be performed on page element B, it can be indicated that page element B is not event page element A, that is, event page element A has failed to be located.
[0160] It should be noted that during the iterative development of the front-end page, the event page elements used to receive the same page operation event may be interchanged. In this case, even if the located event page element is incorrect, it can still be considered that the location of the event page element is successful. For example, after the event page element A that receives the click operation event and the event page element B that receives the click operation event are interchanged, the page element actually located based on the test path of the event page element A may be the event page element B, but the click operation can still be performed on the event page element B, then it can be considered that the location of the event page element A is successful, that is, the located page element is considered to be the event page element A. However, it is possible to determine whether the located event page element is correct by subsequent test diagram testing (i.e., steps S31 to S34).
[0161] It is understandable that, since the candidate paths are recorded according to different positioning strategies, and different positioning strategies represent different element attributes, there can be at least some candidate paths that have not been invalidated during the iterative development of the front-end page. For example, assuming that the test path of the event page element is determined based on the element attributes class+tag, when the element attributes class and tag change, the test path and the candidate paths recorded based on the element attributes class and tag will become invalid. However, among the candidate paths, there may also be candidate paths determined based on the element attributes data and ID, so the candidate paths determined based on the element attributes data and ID can be relocated to the event page element.
[0162] After relocating to the event page element, the test path in the test case can be repaired according to the actual test path of the event page element in the front-end page, and the invalid candidate path can be repaired according to the actual candidate path of the event page element in the front-end page. When repairing the invalid candidate path of the event page element, step S32 can be re-executed to redetermine the candidate path based on the current actual element attributes of the event page element. At the same time, the test path can also be regenerated according to the path generation logic of the test path based on the current actual element attributes of the event page element.
[0163] In summary, in the technical solutions of some embodiments of the present application, multiple candidate paths for locating event page elements are recorded according to different positioning strategies. In this way, in the case where the event page element fails to be located through the test path in the test case, the event page element can be relocated through the candidate path, and the test path can be repaired based on the actual path of the relocated event page element in the front-end page. Through the solution of the present application, automatic repair of the test path can be achieved, and then there is no need to manually check and modify the failed test path in the test case, reducing the manual workload.
[0164] The solution of this application is further described below.
[0165] In some embodiments, in order to ensure that all candidate paths are not invalid, when recording candidate paths, pre-selected element attributes may be combined in all possible combinations, and after obtaining a large number of positioning strategies, a candidate path is recorded based on each positioning strategy. For example, in step S31, after combining the element attributes data, ID, class, and tag in all possible combinations, the following 15 positioning strategies are obtained: data, ID, class, tag, data+ID, data+class, data+tag, ID+class, ID+tag, class+tag, data+ID+class, data+ID+tag, data+class+tag, ID+class+tag, data+ID+class+tag. Then, a candidate path is recorded based on each positioning strategy, and a total of 15 candidate paths can be obtained.
[0166] This method obtains more candidate paths. On the one hand, the storage space consumed to save these candidate paths will be larger. On the other hand, when relocating event page elements, it is necessary to locate the event page elements based on each candidate path separately, which takes a long time.
[0167] In view of this, the positioning strategy can be screened to reduce the number of candidate paths while ensuring that all candidate paths will not become invalid. Specifically, in some embodiments, priorities can be set for element attributes, and the priorities represent the probability that the element attributes are unique. The higher the priority of the element attribute, the greater the probability that it is unique in the front-end page. For example, the priority order of the element attributes data, ID, class, and tag can be expressed as: data>ID>class>tag. That is, the priority of the element attribute data is higher than the element attribute ID, the priority of the element attribute ID is higher than the element attribute class, and the priority of the element attribute class is higher than the element attribute tag.
[0168] Based on the priority of the element attribute, the recording of the unique target element attribute in step S32 may include:
[0169] When there are multiple unique target element attributes for an event page element, the target element attribute with the highest priority is recorded.
[0170] Furthermore, when the event page element does not have a unique target element attribute, searching and recording a unique first target element attribute combination from the event page element and the parent node of the event page element in step S32 may include:
[0171] The target element attribute with the highest priority of the event page element is recorded, and each target element attribute of the upper node is respectively combined with the target element attribute with the highest priority to find the first target element attribute combination.
[0172] In this way, among the positioning strategies obtained by combining all possible combinations, there may be equivalent positioning strategies. For example, assuming that the priority order of element attributes data, ID, class, and tag is: data>ID>class>tag, in the positioning strategies data, data+ID, data+class, data+tag, data+ID+class, data+ID+tag, data+class+tag, and data+ID+class+tag, if the element attribute data is unique, then when recording candidate paths based on these positioning strategies, the element attribute data is recorded, that is, these positioning strategies are equivalent. Similarly, in the positioning strategies ID, ID+class, ID+tag, and ID+class+tag, if the element attribute ID is unique, then when recording candidate paths based on these positioning strategies, the element attribute ID is recorded, that is, these positioning strategies are also equivalent.
[0173] In summary, for different positioning strategies, if these positioning strategies have the same element attributes with the highest priority, these positioning strategies can be replaced by one positioning strategy. Among them, the positioning strategy used for replacement can be used to represent all element attributes represented by these positioning strategies. For example, assume that the priority order of element attributes data, ID, class, and tag is: data>ID>class>tag.
[0174] Among the positioning strategies data, data+ID, data+class, data+tag, data+ID+class, data+ID+tag, data+class+tag, and data+ID+class+tag, these positioning strategies have the same element attribute with the highest priority (all data), so one positioning strategy can be used to replace these positioning strategies. And because the element attributes represented by these positioning strategies include data, ID, class, and tag, the positioning strategy data+ID+class+tag can be used to replace all the above positioning strategies.
[0175] Similarly, you can use positioning strategy ID+class+tag to replace positioning strategy ID, ID+class, ID+tag, ID+class+tag, and use positioning strategy class+tag to replace positioning strategy class, class+tag.
[0176] After the location strategy is replaced, the 15 location strategies based on the element attributes data, ID, class, and tag can be reduced to 4, namely: tag, class+tag, ID+class+tag, and data+ID+class+tag. That is, it is only necessary to record candidate paths based on the location strategies tag, class+tag, ID+class+tag, and data+ID+class+tag. In this way, the candidate paths are reduced, and the storage resources used to save the candidate paths are reduced, and the time for relocating the event page elements is reduced.
[0177] In this embodiment, when recording a candidate path, a finder function can be called, and the target element attribute represented by the target positioning strategy is used as an input parameter of the finder function. The finder function searches for a unique target element attribute of the event page element according to the priority between the target element attributes, or searches for a unique first target element attribute combination in the event page element and the parent node of the event page element, and returns the found result. For example, assume that the priority order of the element attributes data, ID, class, and tag is: data>ID>class>tag. After sending the target page attributes ID, class, and tag represented by the target positioning function to the finder function, the finder function first determines whether the element attribute ID of the event page element is unique. If so, the element attribute ID is directly returned without determining whether the element attributes class and tag are unique. Furthermore, if the page attributes ID, class, and tag of the event page element are not unique, first combine the target element attribute ID of the event page element's parent node with the target element with the highest priority (i.e., data) of the event page element, and determine whether the combination is unique. If so, return the found combination; if not, combine the target element attribute class of the event page element's parent node with the element attribute data of the event page element, and determine whether the combination is unique. And so on.
[0178] Furthermore, in different websites, there may be situations where the attribute values of target element attributes are dynamically generated. It is understandable that target element attributes whose attribute values are dynamically generated cannot be used to record candidate paths. For example, when recording a candidate path, the recorded target element attribute x=xx1, but when relocating the event page element based on the candidate path, the attribute value of the target element attribute x becomes yy1, then the target element attribute cannot be successfully located based on the recorded candidate path. In other words, the candidate path recorded based on the target element attribute whose attribute value is dynamically generated may be an invalid candidate path.
[0179] In view of this, when recording candidate paths based on the target positioning strategy, the element path repair method of the present application also includes:
[0180] If the target element attributes include a first target element attribute whose attribute value is dynamically generated, remove the first target element attribute from the target element attributes;
[0181] The candidate paths are recorded based on the target element attributes after the first target element attributes are removed.
[0182] Specifically, before calling the finder function, it can be pre-determined whether the target element attribute represented by the target positioning strategy includes the first target element attribute whose attribute value is dynamically generated. If it is included, the first target element attribute is eliminated, and the target element attribute after eliminating the first target element attribute is used as the input parameter of the finder function. The finder function searches the target element attributes after eliminating the first target element attribute to find whether the event page element has a unique target element attribute, or searches the event page element and the parent node of the event page element for a unique combination of first target element attributes. In this way, invalid candidate paths are avoided from being generated based on the first target element attribute that is dynamically generated based on the attribute value.
[0183] For example, taking the element attributes data, ID, class, and tag as an example, we can know from the above description that based on the element attributes data, ID, class, and tag, we can get four positioning strategies, which are:
[0184] tag, class+tag, ID+class+tag, data+ID+class+tag
[0185] Usually, the attribute values of element attributes tag and data are not generated dynamically, so:
[0186] When the attribute value of the element attribute ID is dynamically generated, the element attribute ID is removed from the above four positioning strategies, and the positioning strategies become: tag, class+tag, data+class+tag
[0187] When the attribute value of the element attribute class is dynamically generated, remove the element attribute class from the above four positioning strategies, and the positioning strategies become: tag, ID+tag, data+ID+tag
[0188] And so on.
[0189] Furthermore, in some embodiments, the target element attribute may also include a second target element attribute whose attribute value needs to be input through a human-computer interaction interface. When recording a candidate path based on a target positioning strategy, the element path repair method of the present application also includes:
[0190] If the target element attributes include a second target element attribute whose attribute value needs to be input through the human-computer interaction interface, when the attribute value of the second target element attribute is not received, candidate paths are recorded based on target element attributes other than the second target element attribute; when the second target element attribute is received, candidate paths are recorded based on all target element attributes including the second target element attribute.
[0191] This is understandable. When the attribute value of the second target element attribute does not exist, positioning cannot be performed based on the second target element attribute, so the second target element attribute needs to be eliminated.
[0192] Still taking the element attributes data, ID, class, and tag as an example, assume that the attribute value of the element attribute data needs to be input through the human-computer interaction interface. On this basis:
[0193] If the attribute values of the above four element attributes are not dynamically generated, and the attribute value of the element attribute data is received, then based on the element attributes data, ID, class, and tag, the following four positioning strategies can be obtained: tag, class+tag, ID+class+tag, data+ID+class+tag
[0194] If the attribute values of the above four element attributes are not dynamically generated, and the attribute value of the element attribute data is not received, then based on the element attributes data, ID, class, and tag, the following four positioning strategies can be obtained: tag, class+tag, ID+class+tag, ID+class+tag
[0195] If, among the above four element attributes, the element attribute ID is dynamically generated and the attribute value of the element attribute data is received, then based on the element attributes data, ID, class, and tag, the following three positioning strategies can be obtained: tag, class+tag, data+class+tag
[0196] If, among the above four element attributes, the element attribute ID is dynamically generated and the attribute value of the element attribute data is not received, then based on the element attributes data, ID, class, and tag, the following three positioning strategies can be obtained: tag, class+tag, ID+class+tag
[0197] If, among the above four element attributes, the element attribute class is dynamically generated and the attribute value of the element attribute data is received, then based on the element attributes data, ID, class, and tag, the following three positioning strategies can be obtained: tag, ID+tag, data+ID+tag
[0198] If, among the above four element attributes, the element attribute class is dynamically generated and the attribute value of the element attribute data is not received, then based on the element attributes data, ID, class, and tag, the following three positioning strategies can be obtained: tag, ID+tag, ID+tag
[0199] In this way, recording of invalid candidate paths can be prevented.
[0200] Furthermore, when searching for a unique target element attribute of an event page element, considering that some low-priority target element attributes have a low probability of being unique, it is not necessary to perform a judgment operation on these low-priority target elements to reduce the amount of data processing.
[0201] Specifically, in some embodiments, when determining whether an event page element has a unique target element attribute in the front-end page, if the target element attribute includes a third target element attribute whose priority is higher than the priority threshold, determine whether the event page element has a unique third target element attribute; if the target element attribute includes a fourth target element attribute whose priority is not higher than the priority threshold, then between the kth parent node of the event page element and the event page element, combine the fourth target element attribute of the event page element with the target element attribute of the parent node, and determine whether there is a unique second target element attribute combination; if so, record the second target element attribute combination as a candidate path recorded according to the target positioning strategy.
[0202] In simple terms, for the third target element attribute whose priority is higher than the priority threshold, the third target element attribute is judged to be unique starting from the event page element. For the fourth target element attribute whose priority is not higher than the priority threshold, the second target element attribute combination is judged to be unique between the event page element and the kth parent node of the event page element. The second target element attribute combination includes one of the fourth target element attributes of the event page element and one of the target element attributes of each parent node of the event page element.
[0203] For example, assume that the priority order of element attributes data, ID, class, and tag is: data>ID>class>tag, and the priority threshold is 2, that is, the priority of element attributes data and ID is higher than the priority threshold, and the priority of element attributes class and tag is not higher than the priority threshold. Then, when the target element attributes represented by the target positioning strategy include data, ID, and tag, you can first determine whether the target element attribute data of the event page element is unique in order of priority. If so, record the target element attribute data, and no subsequent operations are required. If not, continue to determine whether the target element attribute ID of the event page element is unique. If so, record the target element attribute ID, and no subsequent operations are required. If not, combine the target element attribute tag attribute of the event page element with the target element attribute of the parent node to determine whether there is a unique second target attribute combination. For example, assuming that the value of k is 3, the target element attribute data can be obtained from the third parent node of the event page element, the target element attribute ID can be obtained from the second parent node of the event page element, and the target element attribute data can be obtained from the first parent node of the event page element. These target element attributes obtained are combined with the target element attribute tag of the event page element to obtain a second target element attribute combination, and it is determined whether the second target element attribute combination is unique. If so, the second target element attribute combination is recorded. If not, other target element attributes of the parent node of the event page element can be combined with the target element attribute tag of the event page element to continue searching for a unique second target element attribute combination.
[0204] If the event page element has neither a unique third target element attribute nor a unique second target element attribute combination, then each target element attribute of the parent node is combined with the target element attribute with the highest priority of the event page element to find the first target element attribute combination. The relevant principle can be found in the description of the first target element attribute, which will not be repeated here.
[0205] In the above scheme, among the target element attributes of the event page element, it is not determined whether the target element attributes with a low priority are unique, which can reduce the amount of data processing.
[0206] Further, in some embodiments, the page element in the front-end page may include a text element attribute. The content in the text element attribute may be text for display in the front-end page. Considering that the text element attribute may include too much text content, which is not convenient for locating the page element, the element attribute represented by the positioning strategy may not include the text element attribute. However, in the case of failure to relocate the event page element through all candidate paths, the element path repair method of the present application may also include:
[0207] Repositions an event page element based on its text element attributes.
[0208] In this way, the reliability of the solution of the present application can be improved.
[0209] This completes the description of the element path repair method of the present application.
[0210] Corresponding to the front-end page testing method, the present application also provides a front-end page testing system. Figure 5 , which is a module diagram of a test system provided in one embodiment of the present application. Figure 5 The test system includes:
[0211] The acquisition module is used to obtain the test image and the benchmark image of the front-end page;
[0212] an alignment module, for aligning the first floating area with the second floating area if the test image includes the first floating area and the reference image includes the second floating area;
[0213] A comparison and matching module, configured to match and compare a first image of the first dynamic area with a second image of the second dynamic area if the test image includes a first dynamic area and the reference image includes a second dynamic area;
[0214] The similarity detection module is used to perform a first similarity detection on the test image and the reference image when the images of the dynamic areas are matched and the floating areas are aligned, and generate a test result of the test image according to the detection result of the first similarity detection.
[0215] See also Figure 6 , is a schematic diagram of an electronic device provided by an embodiment of the present application. The electronic device includes a processor and a memory, the memory is used to store a computer program, and when the computer program is executed by the processor, the above method is implemented.
[0216] The processor may be a central processing unit (CPU). The processor may also be other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), field-programmable gate arrays (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, or a combination of the above chips.
[0217] As a non-transitory computer-readable storage medium, the memory can be used to store non-transitory software programs, non-transitory computer executable programs and modules, such as program instructions / modules corresponding to the method in the embodiment of the present invention. The processor executes various functional applications and data processing of the processor by running the non-transitory software programs, instructions and modules stored in the memory, that is, implementing the method in the above method embodiment.
[0218] The memory may include a program storage area and a data storage area, wherein the program storage area may store an operating system, an application required for at least one function; the data storage area may store data created by the processor, etc. In addition, the memory may include a high-speed random access memory, and may also include a non-transitory memory, such as at least one disk storage device, a flash memory device, or other non-transitory solid-state storage device. In some embodiments, the memory may optionally include a memory remotely disposed relative to the processor, and these remote memories may be connected to the processor via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.
[0219] One embodiment of the present application further provides a computer-readable storage medium, which is used to store a computer program. When the computer program is executed by a processor, the above method is implemented.
[0220] Although the embodiments of the present disclosure have been described in conjunction with the accompanying drawings, those skilled in the art may make various modifications and variations without departing from the spirit and scope of the present disclosure, and such modifications and variations are all within the scope defined by the appended claims.
Claims
1. A front-end page testing method, characterized in that: The method comprises: Obtaining a test image and a reference image of the front-end page; If the test image includes a first floating area and the reference image includes a second floating area, aligning the first floating area with the second floating area; If the test image includes a first dynamic area and the reference image includes a second dynamic area, matching and comparing a first image of the first dynamic area with a second image of the second dynamic area; When the images of the dynamic areas are matched and the floating areas are aligned, a first similarity detection is performed on the test image and the reference image, and a test result of the test image is generated according to a detection result of the first similarity detection.
2. The method according to claim 1, characterized in that Before performing a first similarity detection on the test image and the reference image, the method further includes: If the test image includes a first strict area and the reference image includes a second strict area, performing a second similarity test on the image in the first strict area and the image in the second strict area, and performing the first similarity test if the second similarity test passes; and / or If the test image includes a first ignored area and the reference image includes a second ignored area, the first ignored area is removed from the test image and the second ignored area is removed from the reference image, and similarity detection is performed on the test image and the reference image after the ignored areas are removed.
3. The method according to claim 1 or 2, characterized in that The aligning the first floating area with the second floating area comprises: Taking the first floating area or the second floating area as a target floating area, performing a plurality of first shifts on the target floating area, and calculating a first similarity score between the test image and the reference image after each first shift; The total offset of the target floating area when the first similarity score is maximum is determined, and the first floating area and / or the second floating area is second offset according to the total offset to align the first floating area with the second floating area.
4. The method according to claim 3, characterized in that The performing a plurality of first shifts on the target floating area comprises: offsetting the target floating area in different directions, and calculating a second similarity score between the test image and the reference image after offsetting in each direction; The offset direction of the target floating area when the second similarity score is the largest is determined, and the target floating area is first offset multiple times along the offset direction.
5. The method according to claim 4, characterized in that The performing a second shift on the first floating area and / or the second floating area according to the total shift includes: The floating area serving as the target floating area is moved by a first offset in the offset direction, and the floating area not serving as the target floating area is moved by a second offset in the opposite direction of the offset direction, wherein the sum of the first offset and the second offset is equal to the total offset.
6. The method according to claim 1 or 2, characterized in that: The first image and the second image represent images of dynamic content displayed by the dynamic component; Matching and comparing the first image and the second image includes: Inputting the first image and the second image into a trained matching model, and using the matching model to identify the category of a first dynamic component corresponding to the first image, and to identify the category of a second dynamic component corresponding to the second image; If the category of the first dynamic component is the same as the category of the second dynamic component, it is determined that the first image and the second image match.
7. The method according to claim 6, characterized in that After completing the matching and comparison of the first image and the second image, the method further includes: Displaying the first image, the second image, and a first matching result obtained after matching and comparing the first image and the second image; receiving a second matching result input through a human-computer interaction interface indicating whether the first image and the second image match; If the first matching result is different from the second matching result, the matching model is trained based on the first image, the second image and the second matching result.
8. The method according to claim 1 or 2, characterized in that: Performing a first similarity detection on the test image and the reference image includes: The light and dark difference between the test image and the reference image is eliminated, and a first similarity detection is performed on the test image and the reference image after the light and dark difference is eliminated.
9. The method according to claim 1 or 2, characterized in that: The front-end page includes page elements, and the page elements include event page elements for receiving page operation events; The obtaining of the test image and the reference image of the front-end page includes: In the baseline version of the front-end page, if the event page element receives a page operation event, a page image of the front-end page is intercepted as the baseline image, and a test case is generated for the event page element, the test case including a test path for locating the event page element, the baseline image, and the page operation event received by the event page element; In the test version of the front-end page, the event page element is located based on the test path in the test case, and after the page operation event is performed on the event page element, the page image of the front-end page is captured as the test image.
10. The method according to claim 9, characterized in that When generating the test case, the method further includes: According to different positioning strategies, recording multiple candidate paths for positioning the event page element; In the test version of the front-end page, after locating the event page element based on the test path in the test case fails, the method further includes: The event page element is relocated through the candidate path, and the test path is repaired based on the actual path of the relocated event page element in the front-end page.
11. The method according to claim 10, characterized in that The page element includes a plurality of element attributes, and the positioning strategy represents one or more of the element attributes; The recording of multiple candidate paths for locating the event page element according to different positioning strategies includes: For any target positioning strategy, judging whether the event page element has a unique target element attribute in the front-end page according to the target element attribute represented by the target positioning strategy; If so, record the unique target element attribute as a candidate path recorded according to the target positioning strategy; If not, a unique first target element attribute combination is searched and recorded between the event page element and the parent node of the event page element as a candidate path recorded according to the target positioning strategy.
12. The method according to claim 11, characterized in that The element attribute has a priority, and the priority represents the probability that the element attribute is unique; The recording of the unique target element attribute includes: When the event page element has multiple unique target element attributes, the target element attribute with the highest priority is recorded.
13. The method according to claim 11, characterized in that The element attribute has a priority, and the priority represents the probability that the element attribute is unique; The step of searching and recording a unique first target element attribute combination from the event page element and the parent node of the event page element includes: Recording the target element attribute with the highest priority of the event page element; Each target element attribute of the upper node is combined with the target element attribute with the highest priority to find the first target element attribute combination.
14. The method according to claim 11, characterized in that The element attribute has an attribute value; when recording a candidate path based on the target positioning strategy, the method further includes: If the target element attributes include a first target element attribute whose attribute value is dynamically generated, remove the first target element attribute from the target element attributes; A candidate path is recorded based on the target element attributes after the first target element attributes are removed.
15. The method according to claim 11, characterized in that The element attribute has an attribute value; when recording a candidate path based on the target positioning strategy, the method further includes: If the target element attributes include a second target element attribute whose attribute value needs to be input through the human-computer interaction interface, when the attribute value of the second target element attribute is not received, candidate paths are recorded based on target element attributes other than the second target element attribute; when the second target element attribute is received, candidate paths are recorded based on all target element attributes including the second target element attribute.
16. The method according to claim 11, characterized in that The element attribute has a priority, and the priority represents the probability that the element attribute is unique; The determining in the front-end page whether the event page element has a unique target element attribute includes: If the target element attributes include a third target element attribute whose priority is higher than the priority threshold, it is determined whether the event page element has a unique third target element attribute.
17. The method according to claim 16, characterized in that If the target element attributes include a fourth target element attribute whose priority is not higher than the priority threshold, the method further includes: Between the kth parent node of the event page element and the event page element, the fourth target element attribute of the event page element is combined with the target element attribute of the parent node, and it is determined whether there is a unique second target element attribute combination. If so, the second target element attribute combination is recorded as a candidate path recorded according to the target positioning strategy.
18. A front-end page testing system, characterized in that: The system comprises: An acquisition module, used to acquire a test image and a reference image of the front-end page; an alignment module, configured to align the first floating area with the second floating area if the test image includes a first floating area and the reference image includes a second floating area; a comparison and matching module, configured to match and compare a first image of the first dynamic area with a second image of the second dynamic area if the test image includes a first dynamic area and the reference image includes a second dynamic area; The similarity detection module is used to perform a first similarity detection on the test image and the reference image when the images of the dynamic areas are matched and the floating areas are aligned, and generate a test result of the test image according to the detection result of the first similarity detection.
19. A computer-readable storage medium, characterized in that: The computer-readable storage medium is used to store a computer program, and when the computer program is executed by a processor, the method according to any one of claims 1 to 17 is implemented.
20. An electronic device, characterized in that: The electronic device comprises a processor and a memory, wherein the memory is used to store a computer program, and when the computer program is executed by the processor, the method according to any one of claims 1 to 17 is implemented.