Image comparison test method and device for webpage and electronic equipment

By performing image hole processing and massive screenshot management in web image comparison test, the problem of non-focused information on the web page affecting the accuracy of the test is solved, and a more efficient testing process and lower cost are achieved.

CN119883885APending Publication Date: 2025-04-25CHINA TELECOM CLOUD TECH CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202411762882.5
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2024-12-03
Publication Date
2025-04-25

AI Technical Summary

Technical Problem

The existing web image comparison test method has low test accuracy and low screenshot management efficiency due to the presence of a large number of non-focus information fields on the web page.

Method used

By performing scene operations based on orchestration use case scenarios, generating a comparison diagram, and digging images based on element positioning information of ignored items in the use case scenarios, removing non-focus information and improving test accuracy. At the same time, massive screenshots are managed through scenes and numbers, and reference diagrams are automatically updated using configurable logos to improve testing efficiency.

Benefits of technology

Effectively remove non-focus information in web image comparison test, improve test accuracy and efficiency, and reduce false alarm rate and test costs.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119883885A_ABST
    Figure CN119883885A_ABST
Patent Text Reader

Abstract

The invention discloses an image comparison test method and device for a webpage and electronic equipment. The method comprises the steps that corresponding scene operation is executed based on an arranged use case scene, and a browser is made to display a target webpage; performing screenshot on the target webpage to generate a comparison graph; then, on the basis of element positioning information of a neglect item in the case scene, first hole digging information is determined from the comparison graph, and second hole digging information is determined from a reference graph corresponding to the comparison graph; performing hole digging processing on the comparison image based on the first hole digging information, and performing hole digging processing on the reference image based on the second hole digging information so as to effectively remove neglected items in the comparison image and the reference image and reduce test interference items of the whole page; and then, the comparison image and the reference image which are subjected to hole digging processing are compared to generate a comparison result, so that the influence of the neglect item on the image comparison test is reduced, and the accuracy of the image comparison test for the webpage is improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the technical field of software testing and software engineering, and in particular to a method, device, electronic device and medium for image comparison testing of web pages. Background Art

[0002] With the continuous development of information technology, information systems have entered into various fields of human work and life. Due to the needs of human-computer interaction, information systems need to use clients or browsers to provide users with an operation interface for information exchange.

[0003] As a major form of human-computer interaction in information systems, the page layout, format, and content verification of web pages are very important. Currently, web page verification is mainly divided into automated logic verification and image comparison verification. The method of using image comparison for verification has the advantages of simple test architecture, low maintenance cost of use cases, and easy readability of test results. It is a better choice for automated verification.

[0004] The general method for comparing web page images is: first, arrange the automated operation steps to form an automated scenario, which points to a specific web page; second, use the screenshot software in the scenario of software version one to capture the web page image and save it; third, after releasing the new software version two, enter the scenario again and capture a new web page image; fourth, compare the images captured twice, version one and version two, find the differences, and assist testers in page review.

[0005] However, the current web page image comparison verification method also has some problems: first, as the web page structure becomes more and more complex and the types of page elements increase, there are a large number of non-focus information fields on the web page. These non-focus information fields are test interference items, which affect the accuracy of the comparison test; secondly, the web page image comparison test will generate a large number of screenshots, and the chaotic storage management of these screenshots will cause the web page image comparison test to be inefficient. Summary of the invention

[0006] To this end, the present application provides an image comparison test method, device and electronic device for web pages to solve the problem of low accuracy of image comparison test caused by the presence of a large number of non-focus information fields on web pages in the prior art.

[0007] In order to achieve the above-mentioned objectives, the first aspect of the present application provides an image comparison test method for web pages, the method comprising: executing corresponding scenario operations based on an arranged use case scenario to enable a browser to display a target web page; taking a screenshot of the target web page to generate a comparison chart; determining first hole digging information from the comparison chart based on element positioning information of ignored items in the use case scenario, and determining second hole digging information from a reference chart corresponding to the comparison chart; performing hole digging processing on the comparison chart based on the first hole digging information, and performing hole digging processing on the reference chart based on the second hole digging information; comparing the comparison chart after the hole digging processing with the reference chart to generate a comparison result.

[0008] According to the first aspect, after the comparison result is generated, the method further includes: reading a pre-configured maintenance mark; and when the maintenance mark is valid, storing the comparison map overwriting the reference map.

[0009] According to the first aspect, or any implementation of the first aspect above, after taking a screenshot of the target web page to generate a comparison chart, the method also includes: naming the comparison chart based on the name of the use case scenario and the screenshot number; and storing the comparison chart in a first storage area.

[0010] According to the first aspect, or any implementation of the first aspect above, the step of storing the comparison image over the reference image includes: after copying the comparison image from the first storage area, pasting the comparison image into the second storage area storing the reference image, and storing the comparison image over the reference image.

[0011] According to the first aspect, or any implementation of the first aspect above, before determining the first digging information from the comparison diagram based on the element location information of the ignored items in the use case scenario, the method also includes: obtaining the corresponding ignored item configuration directory based on the scenario index information corresponding to the use case scenario; and reading the element location information from the ignored item configuration directory.

[0012] According to the first aspect, or any implementation method of the first aspect above, the step of determining the first digging information from the comparison diagram based on the element positioning information of the ignored items in the use case scenario includes: for each ignored item, determining the coordinate position and element size of the ignored item in the comparison diagram based on the element positioning information of the ignored item.

[0013] According to the first aspect, or any implementation of the first aspect above, the step of comparing the comparison image after the hole digging processing and the reference image to generate a comparison result includes: based on the image comparison configuration parameters, comparing the comparison image after the hole digging processing and the reference image to generate a comparison result; wherein the image comparison configuration parameters include the minimum comparison pixel; the comparison result includes difference indication information and difference image information, or includes no difference indication information.

[0014] The second aspect of the present application provides an image comparison test device for web pages, which includes: a scenario generation module, which is used to perform corresponding scenario operations based on an arranged use case scenario, so that the browser displays the target web page; a screenshot module, which is used to take a screenshot of the target web page to generate a comparison image; a hole digging information acquisition module, which is used to determine first hole digging information from the comparison image based on element positioning information of ignored items in the use case scenario, and to determine second hole digging information from a reference image corresponding to the comparison image; a hole digging processing module, which is used to perform hole digging processing on the comparison image based on the first hole digging information, and to perform hole digging processing on the reference image based on the second hole digging information; an image comparison module, which is used to compare the comparison image after hole digging processing with the reference image to generate a comparison result.

[0015] The third aspect of the present application provides an electronic device, which includes: one or more processors; a storage device on which one or more programs are stored, and when the one or more programs are executed by one or more processors, the one or more processors implement any one of the methods in the first aspect; one or more I / O interfaces, connected between the processor and the memory, and configured to implement information interaction between the processor and the memory.

[0016] A fourth aspect of the present application provides a computer-readable medium having a computer program stored thereon, which implements any one of the methods in the first aspect when the program is executed by a processor.

[0017] The present application has the following advantages: an embodiment of the present application provides an image comparison test method for a web page, the method comprising: executing corresponding scenario operations based on an arranged use case scenario to enable a browser to display a target web page; taking a screenshot of the target web page to generate a comparison image; then, based on element location information of ignored items in the use case scenario, determining first hole digging information from the comparison image, and determining second hole digging information from a reference image corresponding to the comparison image; performing hole digging processing on the comparison image based on the first hole digging information, and performing hole digging processing on the reference image based on the second hole digging information, so as to effectively remove non-focus information in the comparison image and the reference image, and reduce test interference items for the entire page; then, comparing the comparison image after the hole digging processing with the reference image to generate a comparison result, thereby reducing the influence of non-focus information (ignored items) on the image comparison test and improving the accuracy of the image comparison test for the web page. BRIEF DESCRIPTION OF THE DRAWINGS

[0018] The accompanying drawings are used to provide further understanding of the present application and constitute a part of the specification. Together with the following specific embodiments, they are used to explain the present application, but do not constitute a limitation to the present application.

[0019] Figure 1 A schematic diagram of a flow chart of an image comparison test method for a web page provided in an embodiment of the present application;

[0020] Figure 2 A schematic diagram of a flow chart of another image comparison test method for web pages provided in an embodiment of the present application;

[0021] Figure 3 A schematic diagram of the structure of an image comparison test device for web pages provided in an embodiment of the present application;

[0022] Figure 4 A schematic diagram of the structure of another image comparison test device for web pages provided in an embodiment of the present application;

[0023] Figure 5 A schematic diagram of the structure of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0024] In order to enable those skilled in the art to better understand the technical solutions of the present disclosure, the exemplary embodiments of the present disclosure are described below in conjunction with the accompanying drawings, including various details of the embodiments of the present disclosure to facilitate understanding, which should be considered as merely exemplary. Therefore, those of ordinary skill in the art should recognize that various changes and modifications can be made to the embodiments described herein without departing from the scope and spirit of the present disclosure. Similarly, for the sake of clarity and conciseness, the description of well-known functions and structures is omitted in the following description.

[0025] In the absence of conflict, the various embodiments of the present disclosure and the various features therein may be combined with each other.

[0026] As used herein, the term "and / or" includes any and all combinations of one or more of the associated listed items.

[0027] The terms used in this application are only used to describe specific embodiments and are not intended to limit the present application.As used in this application, the singular forms "a", "an" and "the" are intended to include the plural forms as well, unless the context clearly indicates otherwise.

[0028] When the terms “comprising” and / or “made of…” are used in this application, it specifies the existence of the stated features, integers, steps, operations, elements and / or components, but does not exclude the existence or addition of one or more other features, integers, steps, operations, elements, components and / or groups thereof.

[0029] The embodiments described in the present application may be described with reference to plan views and / or cross-sectional views by means of ideal schematic diagrams of the present application. Therefore, the exemplary illustrations may be modified according to manufacturing techniques and / or tolerances.

[0030] Unless otherwise defined, all terms (including technical and scientific terms) used in this application have the same meaning as those commonly understood by those of ordinary skill in the art. It will also be understood that terms such as those defined in commonly used dictionaries should be interpreted as having a meaning consistent with their meaning in the context of the relevant art and this application, and will not be interpreted as having an idealized or overly formal meaning unless explicitly defined in this application.

[0031] The relevant terms in the embodiments of the present application are explained as follows.

[0032] Reference image: The reference image in the image comparison, that is, the web page image of the old version of the software.

[0033] Comparison image: The comparative image in the image comparison, that is, the web page image of the new version of the software.

[0034] Non-concern information / ignored information: Page information that testers do not need to verify, such as time, random code and other dynamic information, may interfere with the test process and reduce the test accuracy.

[0035] With the continuous development of information technology, information systems have entered into various fields of human work and life. Due to the needs of human-computer interaction, information systems need to use clients or browsers to provide users with an operation interface for information exchange.

[0036] As a major form of human-computer interaction in information systems, the page layout, format, and content verification of web pages are very important. Currently, web page verification is mainly divided into automated logic verification and image comparison verification. The method of using image comparison for verification has the advantages of simple test architecture, low maintenance cost of use cases, and easy readability of test results. It is a better choice for automated verification.

[0037] The general method for comparing web page images is: first, arrange the automated operation steps to form an automated scenario, which points to a specific web page; second, use the screenshot software in the scenario of software version one to capture the web page image and save it; third, after releasing the new software version two, enter the scenario again and capture a new web page image; fourth, compare the images captured twice, version one and version two, find the differences, and assist testers in page review.

[0038] However, the current web page image comparison and verification method also has some problems: first, as the web page structure becomes more and more complex and the types of page elements increase, there are a large number of non-interest information fields on the web page. For example, the web page displays the current time information. Since the time of the two screenshots must be different, this difference will be recognized during the image comparison, resulting in the failure of the test case. However, this time information is not the verification information that the tester is concerned about, and it is a test interference item, which affects the accuracy of the comparison test. Testers should ignore this type of non-interest information when conducting comparison tests; secondly, the current web page image comparison test also has the problem of low efficiency in iterative maintenance. When the information system is relatively complex, the web page image comparison test will generate a large number of screenshots. Previous solutions lacked storage management of massive screenshots and automated iterative update processing of new and old images, resulting in low efficiency of web page image comparison testing.

[0039] To this end, an embodiment of the present application provides an image comparison testing method for web pages, which solves the problem of removing non-focus elements by means of image digging, thereby improving the accuracy of use cases and reducing false alarm rates; and managing massive screenshots by means of scenes and numbers, and automatically updating reference images through configurable identifiers, thereby improving the maintenance efficiency of image comparison automation use cases and reducing testing costs.

[0040] Figure 1 The present invention provides an image comparison test method for web pages. The method is applied to electronic devices. Figure 1 As shown, the image comparison test method for web pages includes: steps S101 to S105.

[0041] Step S101: Execute corresponding scenario operations based on the arranged use case scenario, so that the browser displays the target web page.

[0042] The use case scenario is a specific execution of the use case, which describes how the system responds to a series of events under specific conditions. The target web page is the web page targeted by this image comparison test.

[0043] In an embodiment of the present application, the steps of performing corresponding scenario operations based on the arranged use case scenarios to enable the browser to display the target web page include: enabling the browser to display the target web page by arranging specific operation steps such as browser startup, web page initialization, page element operations, user mouse operations, and user keyboard input.

[0044] Step S102: taking a screenshot of the target webpage to generate a comparison chart.

[0045] Among them, the comparison image is the comparison side of the image in the image comparison test, that is, the web page image of the new version of the software.

[0046] In a possible implementation manner provided in an embodiment of the present application, after taking a screenshot of the target webpage to generate a comparison chart, the method further includes: the following steps 1 and 2.

[0047] Step 1: Name the comparison chart based on the name of the use case scenario and the screenshot number.

[0048] The screenshot number may be the number of the stored screenshot.

[0049] Step 2: storing the comparison chart in the first storage area.

[0050] In one example, the electronic device configures the first storage area as a storage area for the comparison chart in response to a configuration operation by a tester, and stores the comparison chart in the first storage area based on path information of the first storage area.

[0051] In this implementation, the comparison images generated by the electronic device can be stored in the first storage area in an orderly manner, and there will be no chaotic storage of the comparison images, thereby avoiding affecting the subsequent image comparison process.

[0052] In an embodiment of the present application, after generating a comparison chart, an image comparison test can be performed. However, due to the increasing complexity of the current web page structure and the increasing number of page element types, there are a large number of non-concern information fields on the web page, such as the web page showing the current time information. Since the time of the two screenshots must be different, this difference will be recognized when performing image comparison, resulting in the failure of the test case, but this time information is not the verification information that the tester is concerned about, and belongs to the test interference item, which affects the accuracy of the comparison test. Therefore, in the image comparison test method provided in an embodiment of the present application, the ignored item configuration directory corresponding to each use case scenario is pre-configured in the electronic device to illustrate what ignored items are included in each use case scenario.

[0053] In a possible implementation manner provided in an embodiment of the present application, after generating the comparison chart, the image comparison test method for web pages further includes: the following steps 1 and 2.

[0054] Step 1: Based on the scenario index information corresponding to the use case scenario, obtain the corresponding ignored item configuration directory.

[0055] Among them, the ignored item configuration directory corresponding to the use case scenario contains the element location information of each configuration item in the use case scenario. The element location information is used to locate the element in the web page, and the element location information is one or more of the attributes such as the element's identity (ID), element name (name), element class name (class_name), and element tag information (tag_name). It can be understood that the element location information may not be limited to the several examples given in the embodiments of the present application, and any information that can be used to locate the ignored item (element) in the web page can be used as the element location information of the ignored item.

[0056] Step 2: Read the element location information from the ignored item configuration directory.

[0057] Through the above implementation, the electronic device can learn which elements in the target webpage are ignored items. In order to eliminate the influence of these ignored items in the subsequent image comparison test, these ignored items can be processed through the following steps.

[0058] Step S103: Based on the element location information of the ignored items in the use case scenario, determine the first hole digging information from the comparison graph, and determine the second hole digging information from the reference graph corresponding to the comparison graph.

[0059] The first hole digging information includes: the coordinate position and element size of the ignored item in the comparison image. The second hole digging information includes: the coordinate position and element size of the ignored item in the reference image.

[0060] It is understandable that the

[0061] In a possible implementation method provided in an embodiment of the present application, the step of determining the first digging information from the comparison diagram based on the element positioning information of the ignored items in the use case scenario includes: for each ignored item, according to the element positioning information of the ignored item, capturing the corresponding ignored item element from the comparison diagram, thereby determining the coordinate position and element size of the ignored item in the comparison diagram.

[0062] In another possible implementation method provided in an embodiment of the present application, the step of determining the first digging information from the reference image corresponding to the comparison image based on the element positioning information of the ignored items in the use case scenario includes: for each ignored item, according to the element positioning information of the ignored item, capturing the corresponding ignored item element from the reference image corresponding to the comparison image, thereby determining the coordinate position and element size of the ignored item in the reference image corresponding to the comparison image.

[0063] Through the above implementation, the electronic device can determine the hole digging information corresponding to the comparison image and the reference image, so as to facilitate the subsequent processing of the corresponding images.

[0064] Step S104: perform hole digging processing on the comparison image based on the first hole digging information, and perform hole digging processing on the reference image based on the second hole digging information.

[0065] The first hole digging information includes: the coordinate position and element size of the ignored item in the comparison image. The second hole digging information includes: the coordinate position and element size of the ignored item in the reference image.

[0066] In a possible implementation method provided in an embodiment of the present application, hole digging processing is performed on the comparison image based on the first hole digging information, including: for each ignored item, determining the hole digging position according to the coordinate position of the ignored item in the comparison image in the first hole digging information, determining the hole digging size according to the element size of the ignored item in the comparison image, and performing hole digging processing in the comparison image based on the hole digging position and the hole digging size to generate a comparison image after hole digging processing.

[0067] In a possible implementation method provided in an embodiment of the present application, hole digging processing is performed on the reference image based on the second hole digging information, including: for each ignored item, a hole digging position is determined according to the coordinate position of the ignored item in the reference image in the second hole digging information, a hole size is determined according to the element size of the ignored item in the reference image, and a hole digging processing is performed in the reference image based on the hole digging position and the hole size to generate a reference image after hole digging processing.

[0068] It should be noted that the above-mentioned hole digging process may be to crop the designated area in the image, or to draw the designated area in the image into a designated pattern so that the designated pattern covers the designated area.

[0069] Step S105 : comparing the comparison image after the hole digging process with the reference image to generate a comparison result.

[0070] The comparison result includes difference indication information and difference map information, or includes difference indication information. The difference map information indicates the specific difference position through a box selection mark.

[0071] In a possible implementation method provided in an embodiment of the present application, the step of comparing the comparison image after the hole digging processing and the reference image to generate a comparison result (the aforementioned step S105) includes: based on the image comparison configuration parameters, comparing the comparison image after the hole digging processing and the reference image to generate a comparison result.

[0072] The image comparison configuration parameter includes a minimum comparison pixel; the comparison result includes difference indication information and difference map information, or includes difference indication information that does not exist.

[0073] In the embodiment of the present application, after the comparison result is generated, the comparison result is stored in a storage area corresponding to the specified storage path.

[0074] The embodiment of the present application provides an image comparison test method for a web page, the method comprising: executing a corresponding scenario operation based on an arranged use case scenario to enable a browser to display a target web page; taking a screenshot of the target web page to generate a comparison image; then, based on element location information of ignored items in the use case scenario, determining first digging information from the comparison image, and determining second digging information from a reference image corresponding to the comparison image; performing a digging process on the comparison image based on the first digging information, and performing a digging process on the reference image based on the second digging information, so as to effectively remove non-interest information in the comparison image and the reference image, and reduce test interference items for the entire page; then, comparing the comparison image after the digging process with the reference image to generate a comparison result, thereby reducing the influence of non-interest information (ignored items) on the image comparison test and improving the accuracy of the image comparison test for the web page.

[0075] Figure 2 A flowchart of another method for image comparison testing of web pages provided in an embodiment of the present application. Figure 2 As shown, after the comparison result is generated (the above step S105), the image comparison test method for the web page includes: steps S106 to S108.

[0076] Step S106: Read the pre-configured maintenance identifier.

[0077] The validity of the maintenance mark is used to indicate whether to perform automatic maintenance of the reference image. If the maintenance mark is valid, it is determined that the reference image needs to be automatically maintained; if the maintenance mark is invalid, it is not necessary to perform automatic maintenance of the reference image.

[0078] Step S107: Determine whether the maintenance identifier is valid.

[0079] Step S108: When the maintenance mark is valid, the reference image is overwritten with the comparison image for storage.

[0080] The step of storing the comparison image over the reference image includes: after copying the comparison image from the first storage area, pasting the comparison image to the second storage area storing the reference image, and storing the comparison image over the reference image.

[0081] In this step, if the read maintenance identifier is valid, the comparison image is copied to the reference image directory and the original reference image directory is overwritten to achieve the purpose of batch updating of reference images, thereby realizing automated maintenance of reference images.

[0082] When the maintenance mark is invalid, the image comparison test process ends.

[0083] An embodiment of the present application provides another image comparison test method for web pages. In this method, after performing image comparison and generating comparison results, a pre-configured maintenance identifier is read. When the maintenance identifier is valid, the reference image is overwritten with the comparison image for storage. This method manages the orderly storage of massive images by adding scenes to numbers, and triggers the automatic update and maintenance of the image reference image by setting the maintenance identifier, thereby achieving the purpose of reducing the difficulty of image management and the cost of test maintenance.

[0084] The step division of the above methods is only for clear description. When implemented, they can be combined into one step or some steps can be split and decomposed into multiple steps. As long as they include the same logical relationship, they are all within the scope of protection of this application; adding insignificant modifications to the algorithm or process or introducing insignificant designs without changing the core design of the algorithm and process are all within the scope of protection of this application.

[0085] In a second aspect, an embodiment of the present application provides an image comparison test device for web pages. Figure 3 This is a schematic diagram of a structure of an image comparison test device for web pages provided in an embodiment of the present application. Figure 3 The device includes: a scene generation module 31, a screenshot module 32, a hole digging information acquisition module 33, a hole digging processing module 34 and an image comparison module 35.

[0086] The scenario generation module 31 is used to execute corresponding scenario operations based on the arranged use case scenario, so that the browser displays the target web page.

[0087] The screenshot module 32 is used to take a screenshot of the target webpage to generate a comparison chart.

[0088] The hole digging information acquisition module 33 is used to determine the first hole digging information from the comparison graph based on the element positioning information of the ignored items in the use case scenario, and to determine the second hole digging information from the reference graph corresponding to the comparison graph.

[0089] The hole digging processing module 34 is used to perform a hole digging process on the comparison image based on the first hole digging information, and to perform a hole digging process on the reference image based on the second hole digging information.

[0090] The image comparison module 35 is used to compare the comparison image after the hole digging process with the reference image to generate a comparison result.

[0091] The image comparison module 35 is specifically used to: compare the comparison image after the hole digging process and the reference image based on the image comparison configuration parameters to generate a comparison result. The image comparison configuration parameters include the minimum comparison pixel; the comparison result includes difference indication information and difference image information, or includes difference indication information.

[0092] It should be clear that the present application is not limited to the specific configurations and processes described in the above embodiments and shown in the figures. For the convenience and brevity of description, a detailed description of the known methods is omitted here, and the specific working processes of the systems, modules and units described above can refer to the corresponding processes in the aforementioned method embodiments, which will not be repeated here.

[0093] An embodiment of the present application provides an image comparison test device for a web page, in which a scenario generation module is used to perform corresponding scenario operations based on an arranged use case scenario, so that a browser displays a target web page; a screenshot module is used to take a screenshot of the target web page to generate a comparison image; a hole digging information acquisition module is used to determine first hole digging information from the comparison image based on element location information of ignored items in the use case scenario, and to determine second hole digging information from a reference image corresponding to the comparison image; a hole digging processing module is used to perform hole digging processing on the comparison image based on the first hole digging information, and to perform hole digging processing on the reference image based on the second hole digging information, so as to effectively remove non-interest information in the comparison image and the reference image, and reduce test interference items for the entire page; an image comparison module is used to compare the comparison image after the hole digging processing with the reference image, so as to generate a comparison result, thereby reducing the influence of non-interest information (ignored items) on the image comparison test and improving the accuracy of the image comparison test for the web page.

[0094] Figure 4 This is a schematic diagram of another image comparison test device for web pages provided in an embodiment of the present application. Figure 4 As shown, another image comparison test device for web pages, in Figure 3 The provided image comparison test device further includes: a configuration reading module 36 , an image file management module 37 and an image updating module 38 .

[0095] Among them, the configuration reading module 36 is used to read the parameter configuration information required for the image comparison test and pass it to the relevant use module. The parameter configuration information includes the reference image storage directory, the comparison image storage directory, the maintenance mark, the image comparison configuration, the ignored item configuration directory and the element positioning information therein.

[0096] The image file management module 37 is used to generate the name and location information of the image according to the scene name and the reference image / comparison image storage directory, so as to be used by other modules for image storage and reading.

[0097] In one example, the image file management module is used to name the comparison image based on the name of the use case scenario and the screenshot number, so that the screenshot module stores the comparison image in the first storage area.

[0098] The image updating module 38 is used to determine whether to use the comparison image to overwrite the reference image according to the maintenance overwriting flag of the configuration file.

[0099] In one example, after the image comparison module 35 generates the comparison result, the image update module 38 reads the maintenance mark pre-configured by the configuration reading module 36, and, if the maintenance mark is valid, stores the comparison image over the reference image.

[0100] An embodiment of the present application provides an image comparison test device for web pages, which can achieve the following two effects.

[0101] 1. Improve test accuracy

[0102] The other image comparison test device for web pages provided in the embodiment of the present application performs hole digging preprocessing on the image before image comparison, effectively removes non-focus content therein, reduces test interference items of the entire page, and thus achieves the purpose of improving test accuracy.

[0103] 2. Reduce testing costs

[0104] The other image comparison test device for web pages provided in the embodiment of the present application orderly stores and manages massive images by adding scenes and numbers, and triggers automatic update and maintenance of image reference maps by setting maintenance identifiers, thereby achieving the purpose of reducing the difficulty of image management and test maintenance costs.

[0105] It should be clear that the present application is not limited to the specific configurations and processes described in the above embodiments and shown in the figures. For the convenience and brevity of description, a detailed description of the known methods is omitted here, and the specific working processes of the systems, modules and units described above can refer to the corresponding processes in the aforementioned method embodiments, which will not be repeated here.

[0106] Figure 5 This is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application. Figure 5 The electronic device includes: one or more processors 501; a memory 502, on which one or more programs are stored. When the one or more programs are executed by the one or more processors, the one or more processors implement any one of the above-mentioned image comparison test methods for web pages; one or more I / O interfaces 503, connected between the processor and the memory, and configured to implement information interaction between the processor and the memory.

[0107] Among them, the processor 501 is a device with data processing capabilities, including but not limited to a central processing unit (CPU); the memory 502 is a device with data storage capabilities, including but not limited to random access memory (RAM, more specifically SDRAM, DDR, etc.), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory (FLASH); the I / O interface (read-write interface) 503 is connected between the processor 501 and the memory 502, and can realize information interaction between the processor 501 and the memory 502, including but not limited to a data bus (Bus), etc.

[0108] In some embodiments, the processor 501 , the memory 502 , and the I / O interface 503 are connected to each other through a bus, and further connected to other components of the computing device.

[0109] This embodiment also provides a computer-readable medium on which a computer program is stored. When the program is executed by a processor, the image comparison test method for a web page provided by this embodiment is implemented. To avoid repeated description, the specific steps of the image comparison test method for a web page are not repeated here.

[0110] It will be appreciated by those skilled in the art that all or some of the steps, systems, and functional modules / units in the invented method described above may be implemented as software, firmware, hardware, and appropriate combinations thereof. In hardware implementations, the division between the functional modules / units mentioned in the above description does not necessarily correspond to the division of physical components; for example, a physical component may have multiple functions, or a function or step may be performed by several physical components in cooperation. Some physical components or all physical components may be implemented as software executed by a processor, such as a central processing unit, a digital signal processor, or a microprocessor, or implemented as hardware, or implemented as an integrated circuit, such as an application-specific integrated circuit. Such software may be distributed on a computer-readable medium, which may include a computer storage medium (or non-transitory medium) and a communication medium (or temporary medium). As known to those skilled in the art, the term computer storage medium includes volatile and non-volatile, removable and non-removable media implemented in any method or technology for storing information (such as computer-readable instructions, data structures, program modules, or other data). Computer storage media include, but are not limited to, RAM, ROM, EEPROM, flash memory or other memory technology, CD-ROM, digital versatile disks (DVD) or other optical disk storage, magnetic cassettes, magnetic tapes, magnetic disk storage or other magnetic storage devices, or any other medium that can be used to store the desired information and can be accessed by a computer. In addition, it is well known to those skilled in the art that communication media typically contain computer-readable instructions, data structures, program modules, or other data in a modulated data signal such as a carrier wave or other transport mechanism, and may include any information delivery media.

[0111] It should be noted that, in this article, the terms "include", "comprises" or any other variations thereof are intended to cover non-exclusive inclusion, so that a process, method, article or device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or device. In the absence of further restrictions, an element defined by the sentence "comprises a ..." does not exclude the existence of other identical elements in the process, method, article or device including the element.

[0112] Those skilled in the art will understand that although some embodiments described herein include certain features included in other embodiments but not other features, the combination of features from different embodiments is meant to be within the scope of the present embodiment and to form different embodiments.

[0113] It is to be understood that the above embodiments are merely exemplary embodiments used to illustrate the principles of the present application, but the present application is not limited thereto. For those skilled in the art, various modifications and improvements can be made without departing from the spirit and substance of the present application, and these modifications and improvements are also considered to be within the scope of protection of the present application.

Claims

1. A method for image comparison testing of web pages, characterized in that: The method comprises: Execute corresponding scenario operations based on the orchestrated use case scenario, so that the browser displays the target web page; Taking a screenshot of the target webpage to generate a comparison chart; Based on the element location information of the ignored items in the use case scenario, determining first hole digging information from the comparison graph, and determining second hole digging information from the reference graph corresponding to the comparison graph; Performing hole digging processing on the comparison image based on the first hole digging information, and performing hole digging processing on the reference image based on the second hole digging information; The comparison image after the hole digging process is compared with the reference image to generate a comparison result.

2. The method according to claim 1, characterized in that After generating the comparison result, the method further includes: Read pre-configured maintenance identification; When the maintenance mark is valid, the reference image is overwritten with the comparison image for storage.

3. The method according to claim 2, characterized in that After taking a screenshot of the target webpage to generate a comparison chart, the method further includes: Naming the comparison chart based on the name of the use case scenario and the screenshot number; The comparison chart is stored in a first storage area.

4. The method according to claim 3, characterized in that The step of storing the comparison image over the reference image comprises: After copying the comparison image from the first storage area, the comparison image is pasted into the second storage area storing the reference image and is stored over the reference image.

5. The method according to claim 1, characterized in that Before determining the first digging information from the comparison chart based on the element location information of the ignored items in the use case scenario, the method further includes: Based on the scenario index information corresponding to the use case scenario, obtain the corresponding ignored item configuration directory; The element location information is read from the ignored item configuration directory.

6. The method according to claim 5, characterized in that The step of determining the first digging information from the comparison diagram based on the element location information of the ignored items in the use case scenario comprises: For each ignored item, the coordinate position and element size of the ignored item in the comparison graph are determined according to the element positioning information of the ignored item.

7. The method according to claim 1, characterized in that The step of comparing the comparison image after the hole digging process with the reference image to generate a comparison result includes: Based on the image comparison configuration parameters, the comparison image after the hole digging process and the reference image are compared to generate a comparison result; wherein the image comparison configuration parameters include minimum comparison pixels; the comparison result includes difference indication information and difference image information, or includes no difference indication information.

8. An image comparison test device for web pages, characterized in that: The device comprises: A scenario generation module, used to execute corresponding scenario operations based on the arranged use case scenario, so that the browser displays the target web page; A screenshot module, used to take a screenshot of the target webpage to generate a comparison chart; A hole digging information acquisition module, configured to determine first hole digging information from the comparison graph based on element location information of ignored items in the use case scenario, and to determine second hole digging information from a reference graph corresponding to the comparison graph; a hole digging processing module, configured to perform a hole digging processing on the comparison image based on the first hole digging information, and to perform a hole digging processing on the reference image based on the second hole digging information; The image comparison module is used to compare the comparison image after the hole digging process with the reference image to generate a comparison result.

9. An electronic device, characterized in that: include: one or more processors; A storage device having one or more programs stored thereon, wherein when the one or more programs are executed by the one or more processors, the one or more processors implement the method according to any one of claims 1 to 7; One or more I / O interfaces are connected between the processor and the memory and are configured to implement information interaction between the processor and the memory.

10. A computer-readable medium having a computer program stored thereon, wherein the computer program, when executed by a processor, implements the method according to any one of claims 1 to 7.