CN108170427A - A kind of webpage extracting components and multiplexing method based on test - Google Patents
A kind of webpage extracting components and multiplexing method based on test Download PDFInfo
- Publication number
- CN108170427A CN108170427A CN201711379054.3A CN201711379054A CN108170427A CN 108170427 A CN108170427 A CN 108170427A CN 201711379054 A CN201711379054 A CN 201711379054A CN 108170427 A CN108170427 A CN 108170427A
- Authority
- CN
- China
- Prior art keywords
- component
- webpage
- multiplexing
- test
- generation
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/36—Software reuse
Abstract
The embodiment of the invention discloses a kind of webpage extracting components and multiplexing method based on test.By, using code Static Analysis Technology, generating system dependence graph, then the entrance defined in web page source code extracts the component for needing to be multiplexed as starting point from dependency graph in advance using user to webpage.Use the development approach (Test Driven Development) based on Test driver that component is reconstructed later so that the component extracted can be transplanted in destination software systems, become reusable in the component of sample webpage.Web application, the development cost of web game engine and scene and threshold substantially reduce, and development efficiency can also increase, and the energy of developer can be freed from the cumbersome work repeated.
Description
Technical field
The present invention relates to soft project technical field of software development, and in particular to a kind of web application component based on test
Extract the method with multiplexing.
Background technology
Since last decade, due to the fast development of mobile equipment and desk device, the digital device of people is more and more various
Change, raised increasingly for the cost of the respective development and application of distinct device；And at the same time, the development of web application is also abnormal fast
Suddenly, developing instrument layer goes out unclear, and outstanding web application is innumerable.
Most of web applications are based on Development of Modular, and webpage is made of component visually or functionally.These components
The often chief component of a webpage.However the quantity that web application is huge, in addition webpage function and the certain journey of purpose
Homogeneity on degree, it is meant that have in these components much have the function of it is similar.
At the same time, although the developing instrument of web application emerges in an endless stream, exploitation community is enlivened, the exploitation door of web application
For sill with cost there is no reducing, exploitation web application is still a difficult matter for beginner.In addition new web page application is very
The certain components for having webpage functionally may be only repeated, these work is caused to become complicated and boring.
Particularly, in the exploitation of web application, web-based game is highly important one piece.However, game is opened
The development process of various scenes, object and game engine is increasingly complex in hair.Especially game engine and scene, for difference
Game, might have physical engine that is a set of close but being not quite similar or have similar scene setting.However it uses ready-made
Physical engine library be a kind of waste in performance and resource for the demand of lightweight, and flexibility is not to the utmost such as people
Meaning, writes and excessively numerous and diverse from the beginning.If a part for existing game engine or scene can be extracted out with component form, even
Component base is established accordingly, will greatly simplify the work of web game developer.
Based on case above, by the use of existing web application as masterplate, the part that developer needs therefrom is selected as structure
Part, it is extracted and is multiplexed can mitigate repeated labor significantly, simplify web application exploitation.However different developers open
Between the web application of hair, variable naming, project structure or even interface may be far from each other, and are matched and be multiplexed then by hand
It is excessively numerous and diverse.If the expectation function of multiplex environments and the component that is re-used can be described, and then automatic adaptation is carried out, that
The development cost of web application can be substantially reduced with threshold, and development efficiency can also improve, and the energy of developer can be from
It is freed in the cumbersome work repeated.
Prior art usually first designs a set of fixed component base, and structure is combined further according to the demand of each application
Part.Its key step includes：A set of page component, unified interface are developed in advance, and carry out compatible optimization for each platform, it
It is developed afterwards using same set of component, to achieve the purpose that cross-platform multiplexing, reduce cost.Although the technology is in a way
Development cost is reduced, realizes the multiplexing of component, but optional component range has been limited in a pre-defined structure by it
In part library, the freedom of developer's design is significantly limited, exacerbates the homogeneity of web application to a certain extent.And to open
Send out component base a large amount of to meet the free authoring needs of developer, early period, design cost will be raised substantially again.
Invention content
The purpose of the present invention is overcome the shortcomings of existing method, it is proposed that a kind of webpage extracting components based on test are with answering
Use method.By, using code Static Analysis Technology, generating system dependence graph, then with user in advance in web page source code to webpage
Defined in entrance extracted from dependency graph for starting point and need the component that is multiplexed.The exploitation side based on Test driver is used later
Component is reconstructed in method so that the component extracted can be transplanted in destination software systems, become reusable and reality
The component of example webpage.This method, which uses, has webpage as template, and multiplexing wherein component is with simplified with optimizing web application exploitation
Cost.
To solve the above-mentioned problems, the present invention proposes a kind of webpage extracting components and multiplexing method based on test, institute
The method of stating includes：
According to the source code and JavaScript/CSS of webpage and other related resources generation dependency graph, and carried according to user
The entrance of confession extracts component.
The demand and multiplexing example environment described to the component extracted according to test case is reconstructed, and is transplanted to multiple
With the default inlet of sample webpage.
Preferably, it is described to generate dependency graph and extract component, specially：
The HTML code of webpage is positioned with JavaScript and CSS codes with being matched；
Generate the abstract syntax tree AST of webpage；According to the generation system dependence graph such as abstract syntax tree AST；
User or developer are positioned for extracting the predefined entrance of component；
Obtain the initial information of the HTML element attribute of predefined inlet；
Component is extracted, and component is deformed from predefined entrance.
Preferably, the described pair of component extracted is reconstructed and is transplanted to the default inlet of multiplexing sample webpage, tool
Body is：
According to described multiplexing component demand generation test case；
The test case of generation multiplexing example environment；
Create multiplexing test environment；
Automation reconstruct is carried out to component according to test case using genetic algorithm, and is transplanted to the pre- of multiplexing sample webpage
Define inlet.
In embodiments of the present invention, it is proposed that a kind of webpage extracting components and multiplexing method, this method based on test can
By the use of existing web application as masterplate, therefrom to select component (some function of such as webpage, the web game of developer's needs
Some scene material or game engine some part), it is extracted and is multiplexed.Web application, web game engine
It is substantially reduced with the development cost of scene with threshold, development efficiency can also increase, and the energy of developer can be from repetition
It is freed in cumbersome work.
Description of the drawings
In order to illustrate more clearly about the embodiment of the present invention or technical scheme of the prior art, to embodiment or will show below
There is attached drawing needed in technology description to be briefly described, it should be apparent that, the accompanying drawings in the following description is only this
Some embodiments of invention, for those of ordinary skill in the art, without creative efforts, can be with
Other attached drawings are obtained according to these attached drawings.
Fig. 1 is the flow diagram of a kind of the webpage extracting components and multiplexing method based on test of the embodiment of the present invention.
Specific embodiment
Below in conjunction with the attached drawing in the embodiment of the present invention, the technical solution in the embodiment of the present invention is carried out clear, complete
Site preparation describes, it is clear that described embodiment is only part of the embodiment of the present invention, instead of all the embodiments.It is based on
Embodiment in the present invention, those of ordinary skill in the art are obtained every other without creative efforts
Embodiment shall fall within the protection scope of the present invention.
Fig. 1 is the flow diagram of a kind of the webpage extracting components and multiplexing method based on test of the embodiment of the present invention,
As shown in Figure 1, this method includes：
S1, according to the source code and JavaScript/CSS of webpage and other related resources generation dependency graph, and according to use
The entrance that family provides extracts component；
S2, the demand described to the component extracted according to test case and multiplexing example environment are reconstructed, and transplant
To the default inlet of multiplexing sample webpage.
Step S1, it is specific as follows：
S11 positions with being matched the HTML code of webpage with JavaScript and CSS codes.It is used in the step
Attribute of an element (class, id etc.) positions with being matched corresponding JavaScript code with CSS codes in HTML.
S12 generates the abstract syntax tree AST of webpage.Specially according to the relevant JavaScript code of webpage, phase is generated
Answer abstract syntax tree.
S13, according to the generation system dependence graph such as abstract syntax tree AST.System dependence graph refers to webpage correlation in the step
The call graph of the dependence and function of variable in JavaScript code, can pass through time to AST and webpage DOM
It goes through to obtain.DOM, that is, DOM Document Object Model is that the tree structure of webpage html source code represents.
S14, user or developer are positioned for extracting the predefined entrance of component.Entrance is predefined in the step and passes through generation
Definition is marked in code annotation, and extracting work will be using herein as starting point.
S15 obtains the initial information of the HTML element attribute of predefined inlet.Specially to user annotation in S14
The attribute (such as class, id etc.) of the HTML element of inlet is obtained.
S16 extracts component from predefined entrance.It is first with what is obtained in S15 specially since the entrance defined in S14
Beginning information is starting point, traverses the system dependence graph in S13, and all relevant code snippets are extracted out, one entirety of formation, i.e., one
A webpage component.
S17 deforms component.Specially the webpage component that S16 is extracted is further processed, including but not
It is limited to the row internalization deformation of code block.
Step S2, it is specific as follows：
S21, according to described multiplexing component demand generation test case.If component can be used by all these tests
Example, as meet demand.
S22 is multiplexed the test case of example environment.The specially test case of component reusage object instance webpage, comprising
Two parts：The test case of former webpage includes the enhancing test case of the sample webpage after multiplexing component.The survey of the original webpage
Example on probation refers to the test case stated in itself original web application that script web application is included, as itself is not wrapped
Developer is then needed to write test case manually containing test case to be described.Include the sample webpage after multiplexing component
Enhancing test case refers to the test that the web application after the multiplexing Component composition to former webpage and meet demand is described
Use-case.The partial test use-case can by developer according in S21 to being multiplexed the description test case of component demand and described
The test case of former webpage is write.
S23 creates multiplexing test environment.Specially according to HTML code, JavaScript code and CSS codes in S11
Matching relationship, multiplexing sample webpage environment will be placed in entire Template web page with the relevant HTML code of component and CSS codes
In, the test for being JavaScript in S24 creates environment.
S24 carries out automation reconstruct, and be transplanted to multiplexing sample webpage according to test case using genetic algorithm to component
Predefined inlet.Specially：
With genetic algorithm using the code through space internalization transformation formed in S17 as gene pool, filial generation is generated, is carried out numerous
Spread out, natural selection, the operations such as mutation.Wherein：
Every line code is a genetic fragment in gene pool.
Procreation refers to exchange genetic fragment between filial generation.
Natural selection refers to screen generation filial generation, eliminates undesirable filial generation；The cradle of natural selection
System specifically refers to test it using test case.Filial generation component must error-freely after carrying out split with sample webpage first
Pass through the explanation of interpreter (including but not limited to V8JavaScript engines).Then after filial generation component and sample webpage split
Web application must be multiplexed the former webpage test case in the test case of example environment by S22, i.e., " regression test ", to protect
It is intact to demonstrate,prove script function.Filial generation component need to carry out S22 multiplexing example environments with the web application after sample webpage split later
The enhancing test case for including the sample webpage after multiplexing component in test case, to test whether comprising filial generation component demand
Described in new function.
Mutation refers to be changed the filial generation of generation according to certain probability, comprising switch statement or statement block sequence, adds
Add or cancel statement or statement block.
Automation mapping refers to map Template web page with being multiplexed the variable of sample webpage.Variable mappings are based on both sides
The judgement of the operation behavior of relevant variable is obtained in code snippet.Its judgment method is including but not limited to tokenization.
Tokenization refers to labeling, referred to a kind of technology that elaborated code information is converted to sequence label.It converts
After be conducive to that elaborated code information is compared with matching.
The invention discloses a kind of webpage extracting components and multiplexing method based on test, this method can utilize existing
Web application is as masterplate, component (some function of such as webpage, some scene of web game that developer is therefrom selected to need
Some of material or game engine parts), it is extracted and is multiplexed.Web application, web game engine and scene are opened
Hair cost is substantially reduced with threshold, and development efficiency can also increase, and the energy of developer can be from the cumbersome work repeated
It is middle to be freed.
One of ordinary skill in the art will appreciate that all or part of step in the various methods of above-described embodiment is can
It is completed with instructing relevant hardware by program, which can be stored in a computer readable storage medium, storage
Medium can include：Read-only memory (ROM, Read Only Memory), random access memory (RAM, Random
Access Memory), disk or CD etc..
In addition, a kind of webpage extracting components based on test provided above to the embodiment of the present invention and multiplexing method into
It has gone and has been discussed in detail, specific case used herein is expounded the principle of the present invention and embodiment, implements above
The explanation of example is merely used to help understand the method and its core concept of the present invention；Meanwhile for the general technology people of this field
Member, thought according to the present invention, there will be changes in specific embodiments and applications, in conclusion this explanation
Book content should not be construed as limiting the invention.
Claims (3)
1. a kind of webpage extracting components and multiplexing method based on test, which is characterized in that the method includes：
According to the source code and JavaScript/CSS of webpage and other related resources generation dependency graph, and provided according to user
Entrance extracts component.
The demand and multiplexing example environment described to the component extracted according to test case is reconstructed, and it is real to be transplanted to multiplexing
The default inlet of example webpage.
2. webpage extracting components and multiplexing method based on test as described in claim 1, which is characterized in that it is described generation according to
Rely and scheme and extract component step, specially：
The HTML code of webpage is positioned with JavaScript and CSS codes with being matched；
Generate the abstract syntax tree AST of webpage；According to the generation system dependence graph such as abstract syntax tree AST；
User or developer are positioned for extracting the predefined entrance of component；
Obtain the initial information of the HTML element attribute of predefined inlet；
Component is extracted, and component is deformed from predefined entrance.
3. webpage extracting components and multiplexing method based on test as described in claim 1, which is characterized in that described pair of extraction
The component gone out is reconstructed and is transplanted to the default inlet step of multiplexing sample webpage, specially：
According to described multiplexing component demand generation test case；
The test case of generation multiplexing example environment；
Create multiplexing test environment；
Automation reconstruct is carried out to component according to test case using genetic algorithm, and is transplanted to the predefined of multiplexing sample webpage
Inlet.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201711379054.3A CN108170427A (en) | 2017-12-19 | 2017-12-19 | A kind of webpage extracting components and multiplexing method based on test |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201711379054.3A CN108170427A (en) | 2017-12-19 | 2017-12-19 | A kind of webpage extracting components and multiplexing method based on test |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN108170427A true CN108170427A (en) | 2018-06-15 |
Family
ID=62522705
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201711379054.3A Pending CN108170427A (en) | 2017-12-19 | 2017-12-19 | A kind of webpage extracting components and multiplexing method based on test |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN108170427A (en) |
Cited By (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109126124A (en) * | 2018-09-20 | 2019-01-04 | Oppo广东移动通信有限公司 | Engine adaptation method, relevant device and computer readable storage medium |
| CN109240700A (en) * | 2018-07-06 | 2019-01-18 | 北京大学 | Key code localization method and system |
| CN110750449A (en) * | 2019-09-19 | 2020-02-04 | 中山大学 | Test-driven webpage component function extraction method |
| CN111596897A (en) * | 2020-05-07 | 2020-08-28 | 北京百度网讯科技有限公司 | Code multiplexing processing method and device and electronic equipment |
| CN113139145A (en) * | 2021-05-12 | 2021-07-20 | 平安国际智慧城市科技股份有限公司 | Page generation method and device, electronic equipment and readable storage medium |
| CN114138425A (en) * | 2022-02-07 | 2022-03-04 | 广州市玄武无线科技股份有限公司 | Method and device for generating form based on formula |
| CN115756449A (en) * | 2022-12-02 | 2023-03-07 | 之江实验室 | Page multiplexing method and device, storage medium and electronic equipment |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101873323A (en) * | 2010-06-21 | 2010-10-27 | 南京邮电大学 | Web service platform based on program slicing technique |
| US20110054878A1 (en) * | 2009-08-26 | 2011-03-03 | Microsoft Corporation | Automated performance prediction for cloud services |
| CN106547555A (en) * | 2016-10-26 | 2017-03-29 | 安徽扬远信息科技有限公司 | A kind of Test driver method based on Scrum Agile Software Developments |
| CN106960002A (en) * | 2017-02-13 | 2017-07-18 | 上海大学 | A kind of cross-cutting information extraction method of feature based model |
-
2017
- 2017-12-19 CN CN201711379054.3A patent/CN108170427A/en active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20110054878A1 (en) * | 2009-08-26 | 2011-03-03 | Microsoft Corporation | Automated performance prediction for cloud services |
| CN101873323A (en) * | 2010-06-21 | 2010-10-27 | 南京邮电大学 | Web service platform based on program slicing technique |
| CN106547555A (en) * | 2016-10-26 | 2017-03-29 | 安徽扬远信息科技有限公司 | A kind of Test driver method based on Scrum Agile Software Developments |
| CN106960002A (en) * | 2017-02-13 | 2017-07-18 | 上海大学 | A kind of cross-cutting information extraction method of feature based model |
Non-Patent Citations (3)
| Title |
|---|
| 桑大勇等: "《敏捷软件开发方法与实践》", 31 May 2010, 西安电子科技大学出版社 * |
| 郑炜等: "《现代软件工程》", 30 November 2016, 西北工业大学出版社 * |
| 陶湘龙: ""基于XML的网页结构复用及抽取方法研究"", 《中国优秀硕士学位论文全文数据库信息科技辑》 * |
Cited By (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109240700A (en) * | 2018-07-06 | 2019-01-18 | 北京大学 | Key code localization method and system |
| CN109240700B (en) * | 2018-07-06 | 2021-04-23 | 北京大学 | Key code positioning method and system |
| CN109126124A (en) * | 2018-09-20 | 2019-01-04 | Oppo广东移动通信有限公司 | Engine adaptation method, relevant device and computer readable storage medium |
| CN110750449A (en) * | 2019-09-19 | 2020-02-04 | 中山大学 | Test-driven webpage component function extraction method |
| CN111596897A (en) * | 2020-05-07 | 2020-08-28 | 北京百度网讯科技有限公司 | Code multiplexing processing method and device and electronic equipment |
| CN113139145A (en) * | 2021-05-12 | 2021-07-20 | 平安国际智慧城市科技股份有限公司 | Page generation method and device, electronic equipment and readable storage medium |
| CN114138425A (en) * | 2022-02-07 | 2022-03-04 | 广州市玄武无线科技股份有限公司 | Method and device for generating form based on formula |
| CN115756449A (en) * | 2022-12-02 | 2023-03-07 | 之江实验室 | Page multiplexing method and device, storage medium and electronic equipment |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN108170427A (en) | A kind of webpage extracting components and multiplexing method based on test | |
| CN106250128B (en) | Display processing method and device of user interface | |
| CN105068815B (en) | Page editing device interactive device and method | |
| CN109739494B (en) | Tree-LSTM-based API (application program interface) use code generation type recommendation method | |
| Di Lucca et al. | An approach for reverse engineering of web-based applications | |
| CN103383645A (en) | Code generation method and system | |
| CN101499063A (en) | Tracing-based database schema evolution method and system | |
| CN108399086A (en) | A kind of widget management method, server and computer readable storage medium | |
| CN108984693A (en) | A kind of sharing method and system of the program based on artificial intelligence | |
| KR20130017337A (en) | Hybrid app development platform architecture and test method of the same, and computer-readable recording medium with program for the same | |
| CN107526679A (en) | Automated test frame, the automated testing method based on thereon, storage medium and computer equipment | |
| Palermo et al. | ASP. NET MVC 4 in Action: Revised edition of ASP. NET MVC 2 in Action | |
| CN105989068A (en) | Hypertext markup language (HTML) based mobile application generating method and device | |
| CN106557414A (en) | Application testing system and method | |
| CN105094768A (en) | Application interface generation method and application interface generation device | |
| Tolvanen | MetaEdit+ integrated modeling and metamodeling environment for domain-specific languages | |
| CN104866592A (en) | Method and apparatus for displaying abstract in search engine | |
| Freeman et al. | ASP. NET core MVC in context | |
| Kalnins | Business modelling. Languages and tools | |
| CN107015955A (en) | Document edit method and device | |
| CN105183491A (en) | Cross-platform desktop GIS and starting method thereof | |
| Hayat et al. | Extension of interaction flow modeling language for geographical information systems | |
| Lin et al. | Simple run-time infrastructure (SRTI): An accessible distributed computing platform for interdisciplinary simulation | |
| Bazelli et al. | WL++: a framework to build cross-platform mobile applications and RESTful back-ends | |
| CN107526599A (en) | A kind of method of quick design personal presentation website |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| WD01 | Invention patent application deemed withdrawn after publication |
Application publication date: 20180615 |
|
| WD01 | Invention patent application deemed withdrawn after publication |