CN114116514A - User interface test acceptance method - Google Patents
User interface test acceptance method Download PDFInfo
- Publication number
- CN114116514A CN114116514A CN202111470992.0A CN202111470992A CN114116514A CN 114116514 A CN114116514 A CN 114116514A CN 202111470992 A CN202111470992 A CN 202111470992A CN 114116514 A CN114116514 A CN 114116514A
- Authority
- CN
- China
- Prior art keywords
- screenshot
- user interface
- segmentation
- interface
- tested
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/36—Preventing errors by testing or debugging software
- G06F11/3668—Software testing
- G06F11/3672—Test management
- G06F11/3688—Test management for test execution, e.g. scheduling of test suites
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F18/00—Pattern recognition
- G06F18/20—Analysing
- G06F18/22—Matching criteria, e.g. proximity measures
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- General Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- Bioinformatics & Cheminformatics (AREA)
- Evolutionary Biology (AREA)
- Evolutionary Computation (AREA)
- Computer Vision & Pattern Recognition (AREA)
- Bioinformatics & Computational Biology (AREA)
- Artificial Intelligence (AREA)
- Life Sciences & Earth Sciences (AREA)
- Computer Hardware Design (AREA)
- Quality & Reliability (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The invention provides a user interface test acceptance method, which relates to the technical field of interface test and comprises the following steps: traversing a list of interfaces to be tested, acquiring a corresponding user interface screenshot when a user interface to be tested is traversed each time, and calculating the overall similarity between the user interface screenshot and a standard interface screenshot of a corresponding standard interface; when the overall similarity is not less than a set threshold value, the test acceptance of the user interface to be tested is considered to be passed; when the overall similarity is smaller than a set threshold value, segmenting the user interface screenshot and the standard interface screenshot respectively to obtain a plurality of user interface segmentation screenshots and a plurality of standard interface segmentation screenshots; and respectively calculating the segmentation similarity between each user interface segmentation screenshot and the corresponding standard interface segmentation screenshot, and generating a test acceptance report according to the user interface segmentation screenshot corresponding to the segmentation similarity smaller than the set threshold. The method has the advantages of realizing automation of user interface testing and effectively reducing the detection time of testers.
Description
Technical Field
The invention relates to the technical field of interface testing, in particular to a user interface testing acceptance method.
Background
The interface is the most direct layer of software interaction with the user, and the quality of the interface determines the first impression of the user on the software. The reasonable interface can bring easy and pleasant feeling and successful feeling to the user, and on the contrary, the user feels dislike due to the poor interface design. There are three ways to present interface styles: the interface test is carried out in any mode of a multi-window body, a single window body and a resource manager.
The front-end project is fast in iteration and various in page, and a tester needs to intervene to perform interface testing after the development is completed. And (4) interface testing, namely UI testing for short, testing whether the color styles of all elements (including empty characters, controls and the like) seen on the interface of the functional module are uniform, and whether the layout is reasonable and attractive, so that the method accords with user habits and the like. In the prior art, most of the tests on the UI interface still rely on visual observation, so that the efficiency is not high, and the accuracy rate is difficult to achieve scientific guarantee.
Disclosure of Invention
Aiming at the problems in the prior art, the invention provides a user interface test acceptance method, which comprises the following steps:
constructing a list of interfaces to be tested, wherein the list of interfaces to be tested comprises one or more user interfaces to be tested;
traversing the list of the interfaces to be tested, acquiring a user interface screenshot of the user interface to be tested when one user interface to be tested is traversed each time, and calculating the overall similarity between the user interface screenshot and a standard interface screenshot of a corresponding standard interface;
when the overall similarity is not less than a set threshold value, the test acceptance of the user interface to be tested corresponding to the user interface screenshot is considered to pass;
when the overall similarity is smaller than a set threshold value, the user interface screenshot and the corresponding standard interface screenshot are respectively segmented to obtain a plurality of user interface segmentation screenshots and a plurality of corresponding standard interface segmentation screenshots;
and respectively calculating the segmentation similarity between each user interface segmentation screenshot and the corresponding standard interface segmentation screenshot, and generating a corresponding test acceptance report of the user interface to be tested according to the user interface segmentation screenshot corresponding to the segmentation similarity smaller than the set threshold.
Preferably, the overall similarity and the segmentation similarity are calculated by adopting an SSIM algorithm.
Preferably, each user interface segmentation screenshot obtained by segmentation is respectively associated with a corresponding user screenshot position mark, each standard interface segmentation screenshot is respectively associated with a corresponding standard screenshot position mark, and the user screenshot position marks correspond to the standard screenshot position marks one by one;
and respectively calculating the segmentation similarity between each user interface segmentation screenshot and the corresponding standard interface segmentation screenshot according to the user screenshot position mark and the corresponding standard screenshot position mark.
Preferably, the test acceptance report includes the user interface screenshot corresponding to the segmentation similarity smaller than the set threshold and the user screenshot position mark associated with the user interface screenshot.
Preferably, the user screenshot position mark and the standard screenshot position mark are respectively represented by a row and column number of the corresponding user interface screenshot in the user interface screenshot and a row and column number of the corresponding standard interface screenshot in the standard interface screenshot.
Preferably, the process of constructing the list of interfaces to be tested includes:
preparing a corresponding test environment, replacing characters and pictures in the test environment to make the characters and the pictures consistent with the contents in the corresponding standard interface, and obtaining the user interface to be tested;
and constructing and obtaining the list of the interfaces to be tested according to the interface name and the URL address corresponding to each user interface to be tested.
Preferably, the NodeJS environment is adopted to obtain the user interface screenshot of the user interface to be tested.
Preferably, the user interface to be tested is a H5 page.
Preferably, the user interface screenshot and the standard interface screenshot are the same in size and number.
The technical scheme has the following advantages or beneficial effects: the automation of the user interface test is realized, the restoration degree of the front-end user interface is digitalized, the test accuracy is improved, meanwhile, the test efficiency is effectively improved, and further, the detection time of testers is effectively reduced.
Drawings
Fig. 1 is a schematic flowchart of a user interface test acceptance method according to a preferred embodiment of the present application.
Detailed Description
The invention is described in detail below with reference to the figures and specific embodiments. The present application is not limited to this embodiment, and other embodiments may be included in the scope of the present application as long as they meet the gist of the present application.
The method is mainly used for realizing automation and digitization of the user interface test, and solving the problems that efficiency is not high and accuracy rate is difficult to achieve scientific guarantee by means of naked eye observation in the prior art. Also, the scope of protection of the present application should not be limited by the examples used to illustrate the feasibility of the present application.
In accordance with the above-mentioned problems in the prior art, there is provided a method for user interface test acceptance, as shown in fig. 1, including:
constructing a list of interfaces to be tested, wherein the list of interfaces to be tested comprises one or more user interfaces to be tested;
traversing a list of interfaces to be tested, acquiring a user interface screenshot of the user interface to be tested when a user interface to be tested is traversed each time, and calculating the overall similarity between the user interface screenshot and a standard interface screenshot of a corresponding standard interface;
when the overall similarity is not less than a set threshold value, the test acceptance of the user interface to be tested corresponding to the user interface screenshot is considered to pass;
when the overall similarity is smaller than a set threshold, segmenting the user interface screenshot and the corresponding standard interface screenshot respectively to obtain a plurality of user interface segmentation screenshots and a plurality of corresponding standard interface segmentation screenshots;
and respectively calculating the segmentation similarity between each user interface segmentation screenshot and the corresponding standard interface segmentation screenshot, and generating a corresponding test acceptance report of the user interface to be tested according to the user interface segmentation screenshot corresponding to the segmentation similarity smaller than the set threshold.
Specifically, in this embodiment, in the list of interfaces to be tested, one or more user interfaces to be tested may be further configured according to the test requirement. When a plurality of user interfaces to be tested exist, the user interface test acceptance of each user interface to be tested can be automatically executed in sequence, the user interface test acceptance results of the user interfaces to be tested can be obtained by one-time configuration, and the test efficiency is further improved.
Further specifically, the standard interface is a high fidelity effect diagram designed by a designer, and in practical application, a user interface generated based on the high fidelity effect diagram, that is, a user interface to be tested may have content differences, such as differences of characters or partial pictures, in the high fidelity effect diagram, so that the user interface to be tested needs to be compared with the corresponding standard interface to determine whether the user interface to be tested meets requirements. In this embodiment, whether the user interface to be tested meets the requirements is evaluated through the similarity between the user interface to be tested and the corresponding standard interface, specifically, the overall similarity between the screenshot of the user interface to be tested and the screenshot of the standard interface of the corresponding standard interface is firstly compared, and the overall similarity is calculated by using an SSIM algorithm, wherein the specific formula of the SSIM algorithm is as follows:
wherein, x represents a user interface screenshot, y represents a standard interface screenshot, SSIM (x, y) represents the overall similarity, and muxMean, μ, representing user interface screen shotsyMean, σ, representing standard interface screenshotx 2Variance, σ, representing user interface screenshoty 2Variance, σ, representing standard interface screenshotxyRepresenting the covariance of the user interface screenshot and the standard interface screenshot, c1＝(k1L)2，c2＝(k2L)2Denotes a constant to maintain stability, where L denotes the dynamic range of the pixel value, k1＝0.01，k2＝0.03。
The specific value of SSIM (x, y) is between-1 and 1, in general, SSIM (x, y) of two identical pictures is 1, SSIM (x, y) of two slightly different pictures is approximately between 0.97 and 0.99, based on the above, the set threshold value can be configured to be 0.98, namely, when the overall similarity is greater than or equal to the set threshold value, the screenshot of the user interface is considered to meet the requirement of the corresponding standard interface, and the test acceptance of the user interface to be tested corresponding to the screenshot of the user interface is considered to pass. When the overall similarity is smaller than a set threshold, the user interface screenshot is considered to have an area which does not accord with the corresponding standard interface, namely the test acceptance of the user interface to be tested corresponding to the user interface screenshot does not pass, and in order to further determine which specific area of the user interface to be tested does not accord with the standard interface, in the embodiment, the user interface screenshot and the corresponding standard interface screenshot are segmented to obtain a plurality of user interface segmentation screenshots and a plurality of corresponding standard interface segmentation screenshots; and then calculating the segmentation similarity between each user interface segmentation screenshot and the corresponding standard interface segmentation screenshot, wherein the segmentation similarity is calculated by adopting an SSIM algorithm, the calculation formula is the same as that above, the user interface screenshot is replaced by the user interface segmentation screenshot in the formula, and the standard interface screenshot is replaced by the standard interface segmentation screenshot. And then comparing each segmentation similarity with a set threshold respectively, wherein the position area of the user interface segmentation screenshot corresponding to the segmentation similarity smaller than the set threshold on the user interface screenshot is an area where the user interface to be tested does not accord with the standard interface, and based on the position area, a corresponding test acceptance report is generated, so that the tester can pay close attention to communication confirmation between the area which does not accord with the standard interface and the developer through the test acceptance report, and the test time of the tester is effectively saved.
In a preferred embodiment of the application, each user interface segmentation screenshot obtained by segmentation is respectively associated with a corresponding user screenshot position mark, each standard interface segmentation screenshot is respectively associated with a corresponding standard screenshot position mark, and the user screenshot position marks correspond to the standard screenshot position marks one by one;
and respectively calculating the segmentation similarity between each user interface segmentation screenshot and the corresponding standard interface segmentation screenshot according to the user screenshot position mark and the corresponding standard screenshot position mark.
Specifically, in this embodiment, the user interface screenshot and the standard interface screenshot may be equally divided, for example, the user interface screenshot and the standard interface screenshot are respectively divided into 100 equally by using an image tool of the node, and 100 user interface screenshot and 100 standard interface screenshot are correspondingly obtained.
In a preferred embodiment of the present application, the user screenshot position mark and the standard screenshot position mark are respectively represented by a row and column number of the corresponding user interface screenshot in the user interface screenshot and a row and column number of the corresponding standard interface screenshot in the standard interface screenshot.
Specifically, during the segmentation, a position mark may be performed on a corresponding user interface segmentation screenshot, and if the user interface segmentation screenshot is a first segmentation map at the upper left corner of the user interface screenshot, the associated user screenshot position mark may be X11, where the user interface segmentation screenshot is shown to be located in a first row and a first column of the user interface screenshot, and each user interface segmentation screenshot forms a user interface segmentation array X, where X is (X11, X12.., Xmn); similarly, the standard interface cut-shot is associated with a corresponding standard cut-shot position marker, if the standard interface cut-shot is the first cut-shot at the upper left corner of the standard interface cut-shot, the associated standard cut-shot position marker may be Y11, each standard interface cut-shot forms a standard interface cut-shot array Y, Y ═ (Y11, Y12,.., Ymn), then the cut similarity Z11 between the user interface cut-shot corresponding to X11 and the standard interface cut-shot corresponding to Y11 is calculated respectively, and so on, and finally the corresponding cut similarity array Z, Z ═ (Z11, Z12,. Zmn) is obtained.
In a preferred embodiment of the present application, the test acceptance report includes a user interface screenshot corresponding to the segmentation similarity smaller than the set threshold and a user screenshot position mark associated with the user interface screenshot.
Specifically, after the segmentation similarity array Z is generated, the segmentation similarities smaller than the set threshold value, such as Z11 and Z29, are further screened out, which indicates that the user interface segmentation screenshot in the first row and the first column in the user interface screenshot and the user interface segmentation screenshot in the ninth row and the second row do not meet the standard interface screenshot, and based on this, a corresponding test verification report is generated for a tester to check and process.
In a preferred embodiment of the present application, the process of constructing the list of interfaces to be tested includes:
preparing a corresponding test environment, replacing characters and pictures in the test environment to make the characters and the pictures consistent with the contents in the corresponding standard interface, and obtaining a user interface to be tested;
and constructing to-be-tested interface lists according to the interface names and URL addresses corresponding to the to-be-tested user interfaces.
Specifically, in the embodiment, the corresponding user interface to be tested can be accessed and acquired through the URL address, and then the user interface screenshot of the user interface to be tested is acquired by using the nodjs environment, so that batch detection of a plurality of user interfaces to be tested is facilitated, and when the test is completed, a test verification report associated with the corresponding interface name can be generated, so that a tester can check the test conveniently.
In the preferred embodiment of the present application, the user interface to be tested is the H5 page.
Specifically, in the present embodiment, the user interface to be tested includes, but is not limited to, the H5 page.
In a preferred embodiment of the present application, the user interface screenshot and the standard interface screenshot have the same size and number.
As a preferred embodiment, for the test of each user interface to be tested, when the overall similarity is smaller than a set threshold, one or more times of segmentation may be performed according to the difference of the segmentation granularity to confirm the area of the user interface to be tested that does not meet the standard interface. If the user interface screenshot and the corresponding standard interface screenshot can be divided into 100 equal parts at one time for calculating the segmentation similarity, or the user interface screenshot and the corresponding standard interface screenshot can be divided into 20 equal parts at first, the inconsistent user interface screenshot is screened from the 20 equal parts of the user interface screenshot, and further each user interface screenshot can be segmented again, and so on. It can be understood that the method for splitting the user interface screenshot and the corresponding standard interface screenshot can be set by self according to different content distributions of the corresponding user interface to be tested, and is not limited to equal splitting, and only the user interface screenshot and the corresponding standard interface screenshot need to be ensured to be split in the same manner.
While the invention has been described with reference to a preferred embodiment, it will be understood by those skilled in the art that various changes in form and detail may be made therein without departing from the spirit and scope of the invention.
Claims (9)
1. A user interface test acceptance method is characterized by comprising the following steps:
constructing a list of interfaces to be tested, wherein the list of interfaces to be tested comprises one or more user interfaces to be tested;
traversing the list of the interfaces to be tested, acquiring a user interface screenshot of the user interface to be tested when one user interface to be tested is traversed each time, and calculating the overall similarity between the user interface screenshot and a standard interface screenshot of a corresponding standard interface;
when the overall similarity is not less than a set threshold value, the test acceptance of the user interface to be tested corresponding to the user interface screenshot is considered to pass;
when the overall similarity is smaller than a set threshold value, the user interface screenshot and the corresponding standard interface screenshot are respectively segmented to obtain a plurality of user interface segmentation screenshots and a plurality of corresponding standard interface segmentation screenshots;
and respectively calculating the segmentation similarity between each user interface segmentation screenshot and the corresponding standard interface segmentation screenshot, and generating a corresponding test acceptance report of the user interface to be tested according to the user interface segmentation screenshot corresponding to the segmentation similarity smaller than the set threshold.
2. The user interface test acceptance method of claim 1, wherein the overall similarity and the segmentation similarity are calculated by using an SSIM algorithm.
3. The user interface test acceptance method according to claim 1, wherein each of the user interface split screenshots obtained by splitting is associated with a corresponding user screenshot position mark, each of the standard interface split screenshots is associated with a corresponding standard screenshot position mark, and the user screenshot position marks correspond to the standard screenshot position marks one to one;
and respectively calculating the segmentation similarity between each user interface segmentation screenshot and the corresponding standard interface segmentation screenshot according to the user screenshot position mark and the corresponding standard screenshot position mark.
4. The user interface test acceptance method of claim 3, wherein the test acceptance report includes the user interface screenshot corresponding to the slicing similarity smaller than the set threshold and the user screenshot position mark associated therewith.
5. The method as claimed in claim 3, wherein the user screenshot position mark and the standard screenshot position mark are represented by a row number of the corresponding user interface screenshot in the user interface screenshot and a row number of the corresponding standard interface screenshot in the standard interface screenshot, respectively.
6. The user interface test acceptance method of claim 1, wherein the process of building the list of interfaces to be tested comprises:
preparing a corresponding test environment, replacing characters and pictures in the test environment to make the characters and the pictures consistent with the contents in the corresponding standard interface, and obtaining the user interface to be tested;
and constructing and obtaining the list of the interfaces to be tested according to the interface name and the URL address corresponding to each user interface to be tested.
7. The method of claim 1, wherein the nodjs environment is used to obtain the ui screenshot of the ui to be tested.
8. The method of claim 1, wherein the user interface to be tested is a H5 page.
9. The method of claim 1, wherein the user interface screenshot and the standard interface screenshot are the same in size and number.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111470992.0A CN114116514A (en) | 2021-12-03 | 2021-12-03 | User interface test acceptance method |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111470992.0A CN114116514A (en) | 2021-12-03 | 2021-12-03 | User interface test acceptance method |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN114116514A true CN114116514A (en) | 2022-03-01 |
Family
ID=80366800
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202111470992.0A Pending CN114116514A (en) | 2021-12-03 | 2021-12-03 | User interface test acceptance method |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN114116514A (en) |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN116662211A (en) * | 2023-07-31 | 2023-08-29 | 四川弘和数智集团有限公司 | Display interface testing method, device, equipment and medium |
| CN118069538A (en) * | 2024-04-18 | 2024-05-24 | 深圳市爱都科技有限公司 | User interface testing method and device, electronic equipment and medium |
-
2021
- 2021-12-03 CN CN202111470992.0A patent/CN114116514A/en active Pending
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN116662211A (en) * | 2023-07-31 | 2023-08-29 | 四川弘和数智集团有限公司 | Display interface testing method, device, equipment and medium |
| CN116662211B (en) * | 2023-07-31 | 2023-11-03 | 四川弘和数智集团有限公司 | Display interface testing method, device, equipment and medium |
| CN118069538A (en) * | 2024-04-18 | 2024-05-24 | 深圳市爱都科技有限公司 | User interface testing method and device, electronic equipment and medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10803554B2 (en) | Image processing method and device | |
| CN114116514A (en) | User interface test acceptance method | |
| CN106598846B (en) | Application interface method of testing and device | |
| CN111767228A (en) | Interface testing method, device, equipment and medium based on artificial intelligence | |
| CN111259772A (en) | Image annotation method, device, equipment and medium | |
| CN108563559A (en) | A kind of test method of identifying code, device, terminal device and storage medium | |
| CN110879780A (en) | Page abnormity detection method and device, electronic equipment and readable storage medium | |
| CN112633341A (en) | Interface testing method and device, computer equipment and storage medium | |
| CN106709489B (en) | Character recognition processing method and device | |
| CN110990617B (en) | Picture marking method, device, equipment and storage medium | |
| CN112381092A (en) | Tracking method, device and computer readable storage medium | |
| CN112153375A (en) | Front-end performance testing method, device, equipment and medium based on video information | |
| CN109840212B (en) | Function test method, device and equipment of application program and readable storage medium | |
| CN107122395B (en) | Data sampling method and device | |
| CN113342692B (en) | Automatic test case generation method and device, electronic equipment and storage medium | |
| CN112614570B (en) | Sample set labeling method, pathological image classification method, classification model construction method and device | |
| CN108809896A (en) | A kind of information calibration method, device and electronic equipment | |
| CN112084103B (en) | Interface test method, device, equipment and medium | |
| CN113111708A (en) | Vehicle matching sample generation method and device, computer equipment and storage medium | |
| US20230401670A1 (en) | Multi-scale autoencoder generation method, electronic device and readable storage medium | |
| CN111179129A (en) | Courseware quality evaluation method and device, server and storage medium | |
| CN111078564A (en) | UI test case management method and device, computer equipment and computer readable storage medium | |
| JP2017111500A (en) | Character recognizing apparatus, and program | |
| CN112433651B (en) | Region identification method, device, storage medium and device | |
| CN111292396B (en) | Image sample set generation method, device, apparatus and storage medium |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination |