CN105760290A - Problem positioning method based on web front-end testing as well as related device and system - Google Patents
Problem positioning method based on web front-end testing as well as related device and system Download PDFInfo
- Publication number
- CN105760290A CN105760290A CN201410788334.XA CN201410788334A CN105760290A CN 105760290 A CN105760290 A CN 105760290A CN 201410788334 A CN201410788334 A CN 201410788334A CN 105760290 A CN105760290 A CN 105760290A
- Authority
- CN
- China
- Prior art keywords
- code
- source code
- target web
- information
- positioning problems
- 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.)
- Granted
Links
Landscapes
- Information Transfer Between Computers (AREA)
Abstract
The invention discloses a problem positioning method based on web front-end testing as well as a related device and system. According to the invention, the position of problem information, obtained through web front-end testing, in a source code of a target web is determined on the basis of a selector corresponding to a development language of the target web, problem positioning information is obtained, an auxiliary code for describing the problem information is generated and is added to the source code according to the problem positioning information, web display is executed according to the source code with the auxiliary code, so that the problem information corresponding to the auxiliary code is also displayed in the target web while the target web corresponding to the source code is displayed, accordingly, the problem information can be displayed in the related position of a corresponding abnormal web element when the web display is executed, automatic and visualized problem positioning is realized, the positioning efficiency is improved, positioning time consumption is reduced, priority of problems is rapidly determined, the problem with serious influence is solved preferentially, and the risk of target web collapse is reduced and even eliminated.
Description
Technical field
The application relates to webpage front-end technical field of measurement and test, particularly relates to a kind of positioning problems method based on webpage front-end test and relevant apparatus, system.
Background technology
Webpage (web) head end test refers to, for by HTML (i.e. HyperTextMarkupLanguage, HTML), CSS (CascadingStyleSheets, Cascading Style Sheet), XML (i.e. ExtensibleMarkupLanguage, extensible markup language) and the webpage of the front end such as JavaScript development language exploitation, perform static analysis according to its source code and dynamically analyze, obtain the problem information of webpage, so that according to this problem information problem of implementation location and reparation, reach to optimize webpage display effect, improve the purpose of webpage loading velocity.
So-called positioning problems, namely determines abnormal web page element that problem information the is corresponding position in webpage.Conventional positioning problems method needs human assistance analysis, namely, person skilled first passes through ID, the class (class) in problem analysis information, url (i.e. UniformResourceLocator, URL) etc. feature determine the position of the abnormality code that there is individual features in webpage source code, web page element that abnormality code the is corresponding position in webpage namely abnormal web page element position in webpage is determined with web page display rule again through comparison source code.
Above-mentioned based on human assistance analysis problem of implementation location, not only efficiency is low, cost is high, also results in and cannot quickly determine the influence surface of each problem and reparation priority in webpage, is unfavorable for repairing in time serious problems, there is bigger webpage collapse equivalent risk.
Summary of the invention
For overcoming Problems existing in correlation technique, the application provides a kind of positioning problems method based on webpage front-end test and relevant apparatus, system.
The application first aspect provides a kind of positioning problems method based on webpage front-end test；The method includes:
Obtain the source code of target web and the problem information of the target web obtained by webpage front-end test；
Determine abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information；
Generate the auxiliary code for describing described problem information；
According to described positioning problems information, described auxiliary code is added into the relevant position place of abnormality code corresponding in described source code；
Web page display is performed so that described problem information is shown in the relevant position place of abnormal web page element corresponding in target web according to the described source code with auxiliary code.
In conjunction with first aspect, in the first feasible embodiment of first aspect, the described relevant position place that according to described positioning problems information, described auxiliary code is added into abnormality code corresponding in described source code, including:
Resolve according to described source code and obtain the document dbject model DOM that target web is corresponding；
The trouble node in described DOM is determined according to described positioning problems information；
Determine the abnormal elements display area that described trouble node is corresponding in target web；
Select the region relevant to described abnormal elements display area as problem information display area according to preset rules, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
In conjunction with the first feasible embodiment of first aspect, in the embodiment that the second of first aspect is feasible, described positioning problems method also includes:
Generate and preset the marker code that labelling is corresponding, and described marker code is added in described source code, in order to when showing target web, described default labelling is showed in described abnormal elements display area.
The application second aspect provides a kind of positioning problems device based on webpage front-end test；This device includes:
Test result acquiring unit, for obtaining the source code of target web, and the problem information of the target web obtained by webpage front-end test；
Location information acquisition unit, for determining abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtains positioning problems information；
Auxiliary code generates unit, for generating the auxiliary code for describing described problem information；
Source code edit cell, for being added into the relevant position place of abnormality code corresponding in described source code according to described positioning problems information by described auxiliary code；
Web page display unit, the source code described in basis with auxiliary code performs web page display so that described problem information is shown in the relevant position place of abnormal web page element corresponding in target web.
In conjunction with second aspect, in the first feasible embodiment of second aspect, described source code edit cell includes:
DOM generation module, obtains, for resolving according to described source code, the document dbject model DOM that target web is corresponding；
Trouble node determines module, for determining the trouble node in described DOM according to described positioning problems information；
Abnormal area determines module, the abnormal elements display area corresponding in target web for determining described trouble node；
Auxiliary code inserts module, for selecting the region relevant to described abnormal elements display area as problem information display area according to preset rules, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
In conjunction with the first feasible embodiment of second aspect, in the embodiment that the second of second aspect is feasible, described source code edit cell also includes:
Marker code inserts module, for generating the marker code that default labelling is corresponding, and is added in described source code by described marker code, in order to be showed in described abnormal elements display area by described default labelling when showing target web.
The application third aspect provides a kind of server, for the positioning problems based on webpage front-end test；This server includes:
Processor；
For storing the memorizer of processor executable；
Wherein, described processor is configured to:
Obtain the source code of target web and the problem information of the target web obtained by webpage front-end test；
Determine abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information；
Generate the auxiliary code for describing described problem information；
According to described positioning problems information, described auxiliary code is added into the relevant position place of abnormality code corresponding in described source code, and the described source code with auxiliary code is sent to client so that described client according to described in there is the source code execution web page display of auxiliary code.
In conjunction with the third aspect, in the first feasible embodiment of the third aspect, for realizing being added into by described auxiliary code the relevant position place of abnormality code corresponding in described source code according to described positioning problems information, described server is configured to:
Resolve according to described source code and obtain the document dbject model DOM that target web is corresponding；
The trouble node in described DOM is determined according to described positioning problems information；
Determine the abnormal elements display area that described trouble node is corresponding in target web；
Select the region relevant to described abnormal elements display area as problem information display area according to preset rules, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
In conjunction with the first feasible embodiment of the third aspect, in the embodiment that third aspect the second is feasible, described server is also configured to
Generate and preset the marker code that labelling is corresponding, and described marker code is added in described source code, in order to when showing target web, described default labelling is showed in described abnormal elements display area.
The application fourth aspect provides a kind of webpage front-end test and positioning problems system, including: head end test subsystem, location-server and client；
Described head end test subsystem is configured to:
Target web is performed head end test by the source code according to target web, obtains the problem information of target web；
Described location-server is configured to:
Obtain described source code and problem information；
Determine abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information；
Generate the auxiliary code for describing described problem information；
According to described positioning problems information, described auxiliary code is added into the relevant position place of abnormality code corresponding in described source code, and the described source code with auxiliary code is sent to client；
Described client is configured to:
Web page display is performed so that described problem information is shown in the relevant position place of abnormal web page element corresponding in target web according to the described source code with auxiliary code.
In conjunction with fourth aspect, in the first feasible embodiment of fourth aspect, for realizing being added into by described auxiliary code the relevant position place of abnormality code corresponding in described source code according to described positioning problems information, described location-server is configured to:
Resolve according to described source code and obtain the document dbject model DOM that target web is corresponding；
The trouble node in described DOM is determined according to described positioning problems information；
Determine the abnormality code region that described trouble node is corresponding in described source code；
Described auxiliary code is added into the relevant position place in abnormality code region corresponding in described source code.
In conjunction with the first feasible embodiment of fourth aspect, in the embodiment that fourth aspect the second is feasible, described server is also configured to
Generate and preset the marker code that labelling is corresponding, and described marker code is added in described source code, in order to when showing target web, described default labelling is showed in described abnormal elements display area.
nullFrom above technical scheme，The embodiment of the present application tests the problem information obtained for webpage front-end，It is primarily based on the selector corresponding with the development language of target web and determines described problem information position in the source code of target web，Obtain positioning problems information，And generate the auxiliary code for describing described problem information，Further according to described positioning problems information, described auxiliary code is added in described source code，Then web page display is performed according to this source code with auxiliary code，Make while the target web that display source code is corresponding，The problem information that auxiliary code is corresponding is also shown in target web，And be not arbitrary owing to auxiliary code is added into the position in source code，But the relevant position of the corresponding abnormality code determined according to described positioning problems information，Thus when performing web page display，Problem information can be shown in the relevant position of the abnormal web page element of correspondence；According to above-mentioned web page display result, intuitively the problem of the problem information of each subproblem existed in target web and correspondence can be produced position and show person skilled, achieve automatization, visual positioning problems, location efficiency improves, minimizing consuming time, be conducive to quickly determining the priority of each problem, preferential reparation affects serious problem, thus reducing the risk even eliminating target pages collapse.
It should be appreciated that it is only exemplary and explanatory that above general description and details hereinafter describe, the application can not be limited.
Accompanying drawing explanation
Accompanying drawing herein is merged in description and constitutes the part of this specification, it is shown that meets embodiments of the invention, and is used for explaining principles of the invention together with description.
Fig. 1 is the flow chart of a kind of positioning problems method based on webpage front-end test that the embodiment of the present application provides.
Fig. 2 is the flow chart of the positioning problems method that the another kind that the embodiment of the present application provides is tested based on webpage front-end.
Fig. 3 is that in the positioning problems method shown in Fig. 2, data process schematic diagram.
Fig. 4 is the schematic diagram determining problem information display area in the positioning problems method that the embodiment of the present application provides.
Fig. 5 is the block diagram of a kind of positioning problems device based on webpage front-end test that the embodiment of the present application provides.
Fig. 6 is the block diagram of the positioning problems device that the another kind that the embodiment of the present application provides is tested based on webpage front-end.
Fig. 7 is the block diagram of a kind of server that the embodiment of the present application provides.
Fig. 8 is a kind of webpage front-end test of providing of the embodiment of the present application and the block diagram of positioning problems system.
Detailed description of the invention
Here in detail exemplary embodiment being illustrated, its example representation is in the accompanying drawings.When as explained below relates to accompanying drawing, unless otherwise indicated, the same numbers in different accompanying drawings represents same or analogous key element.Embodiment described in following exemplary embodiment does not represent all embodiments consistent with the present invention.On the contrary, they only with in appended claims describe in detail, the present invention some in the example of consistent apparatus and method.
The flow chart of a kind of positioning problems method based on webpage front-end test that Fig. 1 provides for the embodiment of the present application.As it is shown in figure 1, the method comprises the following steps.
S11, obtain the source code of target web, and by the problem information of target web that webpage front-end test obtains.
Webpage front-end test system completes the head end test to target web, and the test result obtained is described problem information；This problem information can include one or more subproblem information, a particular problem in each subproblem information correspondence target web, for instance page title is not shown centered on, the break links etc. of certain subhead；Each subproblem information can include corresponding problem types, producing cause and repair the information such as suggestion.
S12, determine described problem information position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information.
Above-mentioned selector is generally used for element or the component definition specific pattern in webpage with specific characteristic, for instance the element color that id attribute is designated value is defined as redness.The embodiment of the present application utilizes selector, the abnormal web page element that the correlated characteristic that the problems referred to above information related to is corresponding is set to specific pattern, so that it is determined that the position that abnormality code corresponding to these abnormal web page elements is in source code, namely determine the problems referred to above location information.
Based on different front end development languages, the type of selector is also different；For the target web based on HTML, it is possible to adopt CSS selector or XPATH (i.e. XMLPathLanguage, XML Path Language) selector.Such as, based on CSS selector, the element selecting id property value in html source code to be " ID " can adopt following code: $ (" .ID ")；And for example, based on XPATH selector, in selection html source code, in body element, all names are called that the daughter element of div can adopt following code :/html/body/div.
S13, generation are for describing the auxiliary code of described problem information.
S14, according to described positioning problems information, described auxiliary code is added in described source code.
Have recorded abnormality code corresponding to each subproblem information position in source code respectively owing to the problems referred to above position information, the auxiliary code of each subproblem information can be added into according to this positioning problems information the relevant position of the abnormality code of correspondence；For example, it is possible to before the unified first trip setting the abnormality code that auxiliary code is added into correspondence.
The source code described in S15, basis with auxiliary code performs web page display so that described problem information is shown in abnormal web page element position corresponding in target web.
According to auxiliary code point of addition in source code, the relevant position place of the problem information of its correspondence also abnormal web page element that display is corresponding with abnormality code in target web accordingly；Such as, before above auxiliary code is added into the first trip of abnormality code of correspondence, then when performing web page display, before the problem information that auxiliary code is corresponding is also shown in the abnormal web page element that abnormality code is corresponding accordingly.
nullFrom above technical scheme，The embodiment of the present application tests the problem information obtained for webpage front-end，It is primarily based on the selector corresponding with the development language of target web and determines described problem information position in the source code of target web，Obtain positioning problems information，And generate the auxiliary code for describing described problem information，Further according to described positioning problems information, described auxiliary code is added in described source code，Then web page display is performed according to this source code with auxiliary code，Make while the target web that display source code is corresponding，The problem information that auxiliary code is corresponding is also shown in target web，And be not arbitrary owing to auxiliary code is added into the position in source code，But the relevant position of the corresponding abnormality code determined according to described positioning problems information，Thus when performing web page display，Problem information can be shown in the relevant position of the abnormal web page element of correspondence；According to above-mentioned web page display result, intuitively the problem of the problem information of each subproblem existed in target web and correspondence can be produced position and show person skilled, achieve automatization, visual positioning problems, location efficiency improves, minimizing consuming time, be conducive to quickly determining the priority of each problem, preferential reparation affects serious problem, thus reducing the risk even eliminating target pages collapse.
The flow chart of the positioning problems method that Fig. 2 tests based on webpage front-end for the another kind that the embodiment of the present application provides, Fig. 3 is that in the positioning problems method shown in Fig. 2, data process schematic diagram.With reference to Fig. 2 and Fig. 3, this positioning problems method comprises the following steps.
S21, obtain the source code of target web, and by the problem information of target web that webpage front-end test obtains.
S22, determine described problem information position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information.
S23, generation are for describing the auxiliary code of described problem information.
S24, according to described source code resolve obtain the document dbject model that target web is corresponding.
Above-mentioned document dbject model (DocumentObjectModel, DOM), also known as dom tree, is the set of multiple nodes with hierarchical relationship.Each web page element in target web is considered as a node, is coupled together according to the relation between corresponding web page element by each node, it is possible to obtain the model of a tree structure, i.e. dom tree.
S25, determine the trouble node in described DOM according to described positioning problems information.
S26, determine the abnormal elements display area that described trouble node is corresponding in target web.
S27, select according to preset rules the region relevant to described abnormal elements display area as problem information display area, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
Owing to the present embodiment to realize showing problem information in target web, therefore auxiliary code point of addition in source code can be determined according to problem information display area in target web；Wherein, problem information display area in target web can set according to corresponding abnormal web page element display area in target web.The embodiment of the present application presets the relative position between problem information display area and abnormal elements display area, i.e. above-mentioned preset rules, such that it is able to after determined the abnormal elements display area that in target web, each subproblem is corresponding by dom tree, determine the problem information display area of correspondence according to above-mentioned preset rules, and then auxiliary code is added into the code position place that described problem information display area is corresponding.According to practical application request such as target web typesettings, above-mentioned preset rules can be: problem information display area 410 is positioned at upper left side or the upper right side of abnormal elements display area 420, as shown in Figure 4；Certainly, above-mentioned preset rules can also be: problem information display area be positioned at abnormal elements display area, lower left, the position such as surface.
The source code described in S28, basis with auxiliary code performs web page display so that described problem information is shown in abnormal web page element position corresponding in target web.
Above-mentioned steps S24 to S27 achieves and is added in the source code of target web by auxiliary code, based on this, the embodiment of the present application can when performing web page display according to the above-mentioned source code with auxiliary code, the problem information of each subproblem in target web is shown in the relevant range of corresponding abnormal elements display area (namely in problem information display area of correspondence) so that person skilled can learn the position of each abnormal elements and concrete problem information intuitively from this target web display interface.
By above technical scheme it can be seen that the embodiment of the present application first passes through the selector that the front end development language of target web matches, screen in the source code of target web according to the problem information of target web, obtain corresponding positioning problems information；Further according to this positioning problems information, it is determined that the trouble node in the Dom tree of target web, and then determine trouble node position at the abnormality code place of correspondence in source code；The relevant position place that auxiliary code corresponding for problem information is added in source code corresponding abnormality code region；The source code described in final basis with auxiliary code performs web page display, described problem information is made to be shown in the relevant position place of viewing area, abnormal web page element place corresponding in target web, such that it is able to intuitively the problem of the problem information of each subproblem existed in target web and correspondence is produced position to show person skilled, achieve automatization, visual positioning problems, location efficiency improves, minimizing consuming time, be conducive to quickly determining the priority of each problem, preferential reparation affects serious problem, thus reducing the risk even eliminating target pages collapse.
In other embodiments of the application, for improving positioning problems effect, make that the abnormal elements in target web is more prominent easily to be distinguished, performing step S26, namely after determining abnormal elements display area, can also carry out following steps: generate and preset the marker code that labelling is corresponding, and be added in described source code by described marker code.
With reference to Fig. 4, above-mentioned default labelling can be: surrounds the labelling frame 431 of above-mentioned abnormal elements display area, cover the labelling figure layer 432 of above-mentioned abnormal elements display area；Furthermore it is also possible to arrange the color of labelling frame 431 and labelling figure layer 432 (for reaching labelling effect, it is preferable that be different from the background colour of target web and the background color (or the color of domain color is as color of default labelling) of abnormal elements.
The structured flowchart of a kind of positioning problems device based on webpage front-end test that Fig. 5 provides for the embodiment of the present application.With reference to Fig. 5, this positioning problems device includes: test result acquiring unit 110, location information acquisition unit 120, auxiliary code generate unit 130, source code edit cell 140 and web page display unit 150.
This test result acquiring unit 110 is configured to, and obtains the source code of target web and the problem information of the target web obtained by webpage front-end test.
This location information acquisition unit 120 is configured to, and determines abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtains positioning problems information.
This auxiliary code generates unit 130 and is configured to, and described location information is uploaded onto the server, in order to user obtains described location information from described server.
This source code edit cell 140 is configured to, and described auxiliary code is added into the relevant position place of abnormality code corresponding in described source code according to described positioning problems information.
This web page display unit 150 is configured to, and performs web page display according to the described source code with auxiliary code so that described problem information is shown in the relevant position place of abnormal web page element corresponding in target web.
From above technical scheme, while the embodiment of the present application can be implemented in the target web that display source code is corresponding, the problem information that auxiliary code is corresponding is also shown in target web, and be not arbitrary owing to auxiliary code is added into the position in source code, but the relevant position of the corresponding abnormality code determined according to described positioning problems information, thus when performing web page display, problem information can be shown in the relevant position of the abnormal web page element of correspondence；According to above-mentioned web page display result, intuitively the problem of the problem information of each subproblem existed in target web and correspondence can be produced position and show person skilled, achieve automatization, visual positioning problems, location efficiency improves, minimizing consuming time, be conducive to quickly determining the priority of each problem, preferential reparation affects serious problem, thus reducing the risk even eliminating target pages collapse.
With reference to Fig. 6, in one feasible embodiment of the application, source code edit cell 140 may include that
Wherein, this DOM generation module 141 is configured to, and resolves according to described source code and obtains the document dbject model DOM that target web is corresponding；
This trouble node determines that module 142 is configured to, and determines the trouble node in described DOM according to described positioning problems information；
This abnormal area determines that module 143 is configured to, it is determined that the abnormal elements display area that described trouble node is corresponding in target web；
This auxiliary code inserts module 144 and is configured to, select the region relevant to described abnormal elements display area as problem information display area according to preset rules, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
It addition, above-mentioned source code edit cell 140 can also include: marker code inserts module 145.This marker code inserts module 145 and is configured to, and generates and presets the marker code that labelling is corresponding, and is added in described source code by described marker code, in order to be showed in described abnormal elements display area by described default labelling when showing target web.
About the device in above-described embodiment, the concrete mode that wherein modules performs to operate has been described in detail in about the embodiment of the method, and explanation will be not set forth in detail herein.
It addition, the embodiment of the present application additionally provides a kind of computer-readable storage medium, for instance can be ROM, random access memory (RAM), CD-ROM, tape, floppy disk and optical data storage devices etc.；This computer-readable storage medium has program stored therein, when the program in described storage medium is performed by the processor of relevant device (such as server) so that the part or all of step of positioning problems method that this relevant device is able to carry out in said method embodiment recording.
Fig. 7 is the block diagram of the server 600 of a kind of positioning problems realized based on webpage front-end test according to an exemplary embodiment.With reference to Fig. 7, server 600 includes processing assembly 622, and it farther includes one or more processor and the memory resource representated by memorizer 632, can by the instruction of the execution processing assembly 622 for storing, for instance application program.In memorizer 632 application program of storage can include one or more each corresponding to the module of one group of instruction.It is configured to perform instruction additionally, process assembly 622, to perform the problems referred to above localization method.
Server 600 can also include a power supply module 626 and be configured to perform the power management of server 600, and a wired or wireless network interface 650 is configured to be connected to server 600 network and input and output (I/O) interface 658.Server 600 can operate based on the operating system being stored in memorizer 632, for instance WindowsServerTM, MacOSXTM, UnixTM, LinuxTM, FreeBSDTM or similar.
Wherein, in the present embodiment, process assembly 622 by performing the instruction in memorizer 632, it is possible to complete following steps:
Obtain the source code of target web and the problem information of the target web obtained by webpage front-end test；
Determine abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information；
Generate the auxiliary code for describing described problem information；
According to described positioning problems information, described auxiliary code is added into the relevant position place of abnormality code corresponding in described source code, and the described source code with auxiliary code is sent to client so that described client according to described in there is the source code execution web page display of auxiliary code.
In one feasible embodiment of the application, for realizing being added into by described auxiliary code according to described positioning problems information the relevant position place of abnormality code corresponding in described source code, process assembly 622 and can perform following steps:
Resolve according to described source code and obtain the document dbject model DOM that target web is corresponding；
The trouble node in described DOM is determined according to described positioning problems information；
Determine the abnormal elements display area that described trouble node is corresponding in target web；
Select the region relevant to described abnormal elements display area as problem information display area according to preset rules, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
In one feasible embodiment of the application, process assembly 622 and can perform following steps:
Generate and preset the marker code that labelling is corresponding, and described marker code is added in described source code, in order to when showing target web, described default labelling is showed in described abnormal elements display area.
From above technical scheme, while the server that the embodiment of the present application provides can be implemented in the target web that display source code is corresponding, the problem information that auxiliary code is corresponding is also shown in target web, and be not arbitrary owing to auxiliary code is added into the position in source code, but the relevant position of the corresponding abnormality code determined according to described positioning problems information, thus when performing web page display, problem information can be shown in the relevant position of the abnormal web page element of correspondence；According to above-mentioned web page display result, intuitively the problem of the problem information of each subproblem existed in target web and correspondence can be produced position and show person skilled, achieve automatization, visual positioning problems, location efficiency improves, minimizing consuming time, be conducive to quickly determining the priority of each problem, preferential reparation affects serious problem, thus reducing the risk even eliminating target pages collapse.
Fig. 8 is a kind of webpage front-end test of providing of the embodiment of the present application and the structural representation of positioning problems system 700.With reference to Fig. 8, this system includes: head end test subsystem 710, location-server 720 and client 730.
Wherein, head end test subsystem 710 is configured to: according to the source code of target web, target web is performed head end test, obtains the problem information of target web.
Location-server 720 is configured to:
Obtain described source code and problem information；
Determine abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information；
Generate the auxiliary code for describing described problem information；
According to described positioning problems information, described auxiliary code is added into the relevant position place of abnormality code corresponding in described source code, and the described source code with auxiliary code is sent to client
Client 730 is configured to: perform web page display according to the described source code with auxiliary code so that described problem information is shown in the relevant position place of abnormal web page element corresponding in target web.
Additionally, in other feasible embodiments of the application, aforesaid operations " is determined abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web " and can also be performed by head end test subsystem 710, and the source code and problem information that obtain positioning problems information and correspondence is stored in data base；Accordingly, location-server 720 can after the Location Request receiving client 730, directly from data base, obtain the source code of target web, problem information and positioning problems information, then perform to be subsequently generated auxiliary code, auxiliary code is added into the medium operation of source code.
In one feasible embodiment of the application, for realizing being added into by described auxiliary code the relevant position place of abnormality code corresponding in described source code according to described positioning problems information, location-server 720 is configured to:
Resolve according to described source code and obtain the document dbject model DOM that target web is corresponding；
The trouble node in described DOM is determined according to described positioning problems information；
Determine the abnormal elements display area that described trouble node is corresponding in target web；
Select the region relevant to described abnormal elements display area as problem information display area according to preset rules, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
In another feasible embodiment of the application, location-server 720 is also configured to
Generate and preset the marker code that labelling is corresponding, and described marker code is added in described source code, in order to when showing target web, described default labelling is showed in described abnormal elements display area.
By above technical scheme it can be seen that the webpage front-end that the embodiment of the present application provides is tested and positioning problems system can realize the head end test to target web, and the problem information that test obtains is shown in the relevant position of abnormal web page element corresponding in target web；According to above-mentioned web page display result, intuitively the problem of the problem information of each subproblem existed in target web and correspondence can be produced position and show person skilled, achieve automatization, visual positioning problems, location efficiency improves, minimizing consuming time, be conducive to quickly determining the priority of each problem, preferential reparation affects serious problem, thus reducing the risk even eliminating target pages collapse.
Those skilled in the art, after considering description and putting into practice invention disclosed herein, will readily occur to other embodiment of the present invention.The application is intended to any modification of the present invention, purposes or adaptations, and these modification, purposes or adaptations are followed the general principle of the present invention and include the undocumented known general knowledge in the art of the application or conventional techniques means.Description and embodiments is considered only as exemplary, and the true scope of the present invention and spirit are pointed out by claim below.
It should be appreciated that the invention is not limited in precision architecture described above and illustrated in the accompanying drawings, and various amendment and change can carried out without departing from the scope.The scope of the present invention is only limited by appended claim.
Claims (12)
1. the positioning problems method based on webpage front-end test, it is characterised in that including:
Obtain the source code of target web and the problem information of the target web obtained by webpage front-end test；
Determine abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information；
Generate the auxiliary code for describing described problem information；
According to described positioning problems information, described auxiliary code is added into the relevant position place of abnormality code corresponding in described source code；
Web page display is performed so that described problem information is shown in the relevant position place of abnormal web page element corresponding in target web according to the described source code with auxiliary code.
2. positioning problems method according to claim 1, it is characterised in that the described relevant position place that according to described positioning problems information, described auxiliary code is added into abnormality code corresponding in described source code, including:
Resolve according to described source code and obtain the document dbject model DOM that target web is corresponding；
The trouble node in described DOM is determined according to described positioning problems information；
Determine the abnormal elements display area that described trouble node is corresponding in target web；
Select the region relevant to described abnormal elements display area as problem information display area according to preset rules, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
3. positioning problems method according to claim 2, it is characterised in that also include:
Generate and preset the marker code that labelling is corresponding, and described marker code is added in described source code, in order to when showing target web, described default labelling is showed in described abnormal elements display area.
4. the positioning problems device based on webpage front-end test, it is characterised in that including:
Test result acquiring unit, for obtaining the source code of target web, and the problem information of the target web obtained by webpage front-end test；
Location information acquisition unit, for determining abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtains positioning problems information；
Auxiliary code generates unit, for generating the auxiliary code for describing described problem information；
Source code edit cell, for being added into the relevant position place of abnormality code corresponding in described source code according to described positioning problems information by described auxiliary code；
Web page display unit, the source code described in basis with auxiliary code performs web page display so that described problem information is shown in the relevant position place of abnormal web page element corresponding in target web.
5. positioning problems device according to claim 4, it is characterised in that described source code edit cell includes:
DOM generation module, obtains, for resolving according to described source code, the document dbject model DOM that target web is corresponding；
Trouble node determines module, for determining the trouble node in described DOM according to described positioning problems information；
Abnormal area determines module, the abnormal elements display area corresponding in target web for determining described trouble node；
Auxiliary code inserts module, for selecting the region relevant to described abnormal elements display area as problem information display area according to preset rules, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
6. positioning problems device according to claim 5, it is characterised in that described source code edit cell also includes:
Marker code inserts module, for generating the marker code that default labelling is corresponding, and is added in described source code by described marker code, in order to be showed in described abnormal elements display area by described default labelling when showing target web.
7. a server, it is characterised in that for the positioning problems based on webpage front-end test, including:
Processor；
For storing the memorizer of processor executable；
Wherein, described processor is configured to:
Obtain the source code of target web and the problem information of the target web obtained by webpage front-end test；
Determine abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information；
Generate the auxiliary code for describing described problem information；
According to described positioning problems information, described auxiliary code is added into the relevant position place of abnormality code corresponding in described source code, and the described source code with auxiliary code is sent to client so that described client according to described in there is the source code execution web page display of auxiliary code.
8. server according to claim 7, it is characterised in that for realizing being added into by described auxiliary code the relevant position place of abnormality code corresponding in described source code according to described positioning problems information, described server is configured to:
Resolve according to described source code and obtain the document dbject model DOM that target web is corresponding；
The trouble node in described DOM is determined according to described positioning problems information；
Determine the abnormal elements display area that described trouble node is corresponding in target web；
Select the region relevant to described abnormal elements display area as problem information display area according to preset rules, and described auxiliary code is added into the code position place that problem information display area described in described source code is corresponding.
9. server according to claim 8, it is characterised in that described server is also configured to
Generate and preset the marker code that labelling is corresponding, and described marker code is added in described source code, in order to when showing target web, described default labelling is showed in described abnormal elements display area.
10. a webpage front-end test and positioning problems system, it is characterised in that including: head end test subsystem, location-server and client；
Described head end test subsystem is configured to:
Target web is performed head end test by the source code according to target web, obtains the problem information of target web；
Described location-server is configured to:
Obtain described source code and problem information；
Determine abnormality code that described problem information the is corresponding position in described source code based on the selector corresponding with the development language of target web, obtain positioning problems information；
Generate the auxiliary code for describing described problem information；
According to described positioning problems information, described auxiliary code is added into the relevant position place of abnormality code corresponding in described source code, and the described source code with auxiliary code is sent to client；
Described client is configured to:
Web page display is performed so that described problem information is shown in the relevant position place of abnormal web page element corresponding in target web according to the described source code with auxiliary code.
11. system according to claim 10, it is characterised in that for realizing being added into by described auxiliary code the relevant position place of abnormality code corresponding in described source code according to described positioning problems information, described location-server is configured to:
Resolve according to described source code and obtain the document dbject model DOM that target web is corresponding；
The trouble node in described DOM is determined according to described positioning problems information；
Determine the abnormality code region that described trouble node is corresponding in described source code；
Described auxiliary code is added into the relevant position place in abnormality code region corresponding in described source code.
12. system according to claim 11, it is characterised in that described server is also configured to
Generate and preset the marker code that labelling is corresponding, and described marker code is added in described source code, in order to when showing target web, described default labelling is showed in described abnormal elements display area.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410788334.XA CN105760290B (en) | 2014-12-17 | 2014-12-17 | The problem of being tested based on webpage front-end localization method and relevant apparatus, system |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410788334.XA CN105760290B (en) | 2014-12-17 | 2014-12-17 | The problem of being tested based on webpage front-end localization method and relevant apparatus, system |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN105760290A true CN105760290A (en) | 2016-07-13 |
| CN105760290B CN105760290B (en) | 2018-11-13 |
Family
ID=56340308
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201410788334.XA Active CN105760290B (en) | 2014-12-17 | 2014-12-17 | The problem of being tested based on webpage front-end localization method and relevant apparatus, system |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN105760290B (en) |
Cited By (12)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107168881A (en) * | 2017-06-07 | 2017-09-15 | 成都四象联创科技有限公司 | Code positioning and processing method extremely |
| CN107784011A (en) * | 2016-08-30 | 2018-03-09 | 广州市动景计算机科技有限公司 | Web access method, client, web page server and programmable device |
| CN108038020A (en) * | 2018-01-02 | 2018-05-15 | 福建中金在线信息科技有限公司 | Webpage fault trace method, apparatus, electronic equipment and computer-readable storage medium |
| CN108268332A (en) * | 2017-08-10 | 2018-07-10 | 广州神马移动信息科技有限公司 | Webpage abnormality monitoring method, equipment and system |
| CN108959057A (en) * | 2017-05-18 | 2018-12-07 | 腾讯科技（深圳）有限公司 | Test method, test device, storage equipment and the network equipment |
| CN110866212A (en) * | 2019-11-14 | 2020-03-06 | 北京无限光场科技有限公司 | Page abnormity positioning method and device, electronic equipment and computer readable medium |
| CN110955595A (en) * | 2019-11-13 | 2020-04-03 | 中信百信银行股份有限公司 | Problem repairing method and device, electronic equipment and computer readable storage medium |
| CN111176871A (en) * | 2019-08-01 | 2020-05-19 | 腾讯科技（深圳）有限公司 | Target application processing method and device, storage medium and electronic device |
| CN111581063A (en) * | 2020-06-09 | 2020-08-25 | 北京大米未来科技有限公司 | Data processing method, readable storage medium and electronic device |
| CN111930616A (en) * | 2020-07-27 | 2020-11-13 | 北京大米未来科技有限公司 | Data processing method and device, electronic equipment and readable storage medium |
| CN113691405A (en) * | 2021-08-25 | 2021-11-23 | 北京知道创宇信息技术股份有限公司 | Access abnormity diagnosis method and device, storage medium and electronic equipment |
| CN114880612A (en) * | 2022-05-11 | 2022-08-09 | 网易有道信息技术（北京）有限公司 | Method for formula layout exception management and related product |
Family Cites Families (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN100562872C (en) * | 2006-11-07 | 2009-11-25 | 北京酷讯科技有限公司 | Automatic moulding plate information locating method at the structuring webpage |
| CN103365864B (en) * | 2012-03-28 | 2016-06-08 | 上海商派网络科技有限公司 | A kind of method of webpage front-end positioning data |
| CN103377127B (en) * | 2012-04-28 | 2016-04-13 | 阿里巴巴集团控股有限公司 | The development and testing system of web page product, method of testing and device |
| CN103488636B (en) * | 2012-06-11 | 2016-04-13 | 腾讯科技（深圳）有限公司 | A kind of method of browsing web pages in offline state and device |
| CN104077389A (en) * | 2014-06-27 | 2014-10-01 | 北京奇虎科技有限公司 | Display method of webpage element information and browser device |
-
2014
- 2014-12-17 CN CN201410788334.XA patent/CN105760290B/en active Active
Cited By (16)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107784011A (en) * | 2016-08-30 | 2018-03-09 | 广州市动景计算机科技有限公司 | Web access method, client, web page server and programmable device |
| CN108959057A (en) * | 2017-05-18 | 2018-12-07 | 腾讯科技（深圳）有限公司 | Test method, test device, storage equipment and the network equipment |
| CN108959057B (en) * | 2017-05-18 | 2022-12-09 | 深圳市雅阅科技有限公司 | Test method, test device, storage equipment and network equipment |
| CN107168881A (en) * | 2017-06-07 | 2017-09-15 | 成都四象联创科技有限公司 | Code positioning and processing method extremely |
| CN108268332A (en) * | 2017-08-10 | 2018-07-10 | 广州神马移动信息科技有限公司 | Webpage abnormality monitoring method, equipment and system |
| CN108038020A (en) * | 2018-01-02 | 2018-05-15 | 福建中金在线信息科技有限公司 | Webpage fault trace method, apparatus, electronic equipment and computer-readable storage medium |
| CN111176871B (en) * | 2019-08-01 | 2022-02-08 | 腾讯科技（深圳）有限公司 | Target application processing method and device, storage medium and electronic device |
| CN111176871A (en) * | 2019-08-01 | 2020-05-19 | 腾讯科技（深圳）有限公司 | Target application processing method and device, storage medium and electronic device |
| CN110955595A (en) * | 2019-11-13 | 2020-04-03 | 中信百信银行股份有限公司 | Problem repairing method and device, electronic equipment and computer readable storage medium |
| CN110866212A (en) * | 2019-11-14 | 2020-03-06 | 北京无限光场科技有限公司 | Page abnormity positioning method and device, electronic equipment and computer readable medium |
| CN111581063A (en) * | 2020-06-09 | 2020-08-25 | 北京大米未来科技有限公司 | Data processing method, readable storage medium and electronic device |
| CN111930616A (en) * | 2020-07-27 | 2020-11-13 | 北京大米未来科技有限公司 | Data processing method and device, electronic equipment and readable storage medium |
| CN111930616B (en) * | 2020-07-27 | 2024-03-19 | 北京大米未来科技有限公司 | Data processing method, device, electronic equipment and readable storage medium |
| CN113691405A (en) * | 2021-08-25 | 2021-11-23 | 北京知道创宇信息技术股份有限公司 | Access abnormity diagnosis method and device, storage medium and electronic equipment |
| CN113691405B (en) * | 2021-08-25 | 2023-12-01 | 北京知道创宇信息技术股份有限公司 | Access abnormality diagnosis method and device, storage medium and electronic equipment |
| CN114880612A (en) * | 2022-05-11 | 2022-08-09 | 网易有道信息技术（北京）有限公司 | Method for formula layout exception management and related product |
Also Published As
| Publication number | Publication date |
|---|---|
| CN105760290B (en) | 2018-11-13 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN105760290A (en) | Problem positioning method based on web front-end testing as well as related device and system | |
| US20190317884A1 (en) | Processing automation scripts of software | |
| US20180060420A1 (en) | Method and apparatus for natural language query in a workspace analytics system | |
| CN103778234B (en) | The generation method and device of form | |
| US8533664B2 (en) | Method and system to automatically generate GUI object addressing queries | |
| CN102508779B (en) | Automatic performance test script generating system based on web crawler logs and automatic performance test script generating method based on same | |
| US8352913B2 (en) | Generating and resolving component names in an integrated development environment | |
| CN109522228B (en) | Interface automation test data construction method, device, platform and storage medium | |
| JP2013077246A (en) | Method, apparatus, and program for supporting creation and management of metadata for correcting problem in dynamic web application | |
| CN104657274B (en) | software interface test method and device | |
| CN105095092A (en) | Static analysis and dynamic operation based detection of atomic violation of JS (JavaScript) code in Web application | |
| CN105868096A (en) | Methods and apparatuses used for displaying web page test result in browser and device | |
| CN112286814A (en) | Automatic generation system and method of test case script | |
| CN107015903A (en) | A kind of generation method, device and the electronic equipment of interface detection program | |
| CN111858959A (en) | Method and device for generating component relation map, computer equipment and storage medium | |
| CN111427760A (en) | Page testing method, device, equipment and storage medium | |
| CN105224465A (en) | Webpage adjustment method and device | |
| CN103365640A (en) | Cascading style sheet style transformation method and device | |
| CN110058849A (en) | Generation method, device, computer equipment and the storage medium of flow chart | |
| CN113485909A (en) | Test method, test device, computing device, and medium | |
| CN106293671A (en) | A kind of method and device of formation component template | |
| CN105320603A (en) | Locating system and method for browser page elements and automatic testing method thereof | |
| US20240097934A1 (en) | Vehicle bus topological graph display method and apparatus, and device | |
| US8949167B2 (en) | Method and device for the quality analysis of system models | |
| CN112579456B (en) | Web automatic testing method and device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |