CN117827628A - Information display method, device, electronic equipment and storage medium - Google Patents

Information display method, device, electronic equipment and storage medium Download PDF

Info

Publication number
CN117827628A
CN117827628A CN202211199700.9A CN202211199700A CN117827628A CN 117827628 A CN117827628 A CN 117827628A CN 202211199700 A CN202211199700 A CN 202211199700A CN 117827628 A CN117827628 A CN 117827628A
Authority
CN
China
Prior art keywords
application
tested
information
dom
dom information
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
Application number
CN202211199700.9A
Other languages
Chinese (zh)
Inventor
姜竣
高玉龙
郑康
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Xiaomi Mobile Software Co Ltd
Original Assignee
Beijing Xiaomi Mobile Software Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Beijing Xiaomi Mobile Software Co Ltd filed Critical Beijing Xiaomi Mobile Software Co Ltd
Priority to CN202211199700.9A priority Critical patent/CN117827628A/en
Publication of CN117827628A publication Critical patent/CN117827628A/en
Pending legal-status Critical Current

Links

Landscapes

  • Debugging And Monitoring (AREA)

Abstract

The disclosure provides an information display method, an information display device, electronic equipment and a storage medium, and relates to the technical field of computer front-end testing. The specific implementation scheme is as follows: receiving an initialization instruction, wherein the initialization instruction comprises an identifier of an application to be tested; initializing DOM data of a router thread corresponding to an identifier of an application to be tested to acquire first DOM information; returning the first DOM information to the debugging equipment so that the debugging equipment performs information display based on the first DOM information; responding to the change of the page of the application to be tested, and acquiring second DOM information of the JS layer in the application process of the application to be tested; and sending the second DOM information so that the debugging equipment updates the currently displayed content. Therefore, a developer of the Flutter thread can check DOM information of the JS layer in the process of debugging application, and also can check DOM information of the Flutter thread, development efficiency is improved, the Flutter and the DOM data of the JS can be processed in one debugging process, and two modes of adaptation are realized.

Description

Information display method, device, electronic equipment and storage medium
Technical Field
The disclosure relates to the technical field of computer front-end testing, and in particular relates to an information display method, an information display device, electronic equipment and a storage medium.
Background
On an operating system for rendering by using a JavaScript (abbreviated as 'JS') development application and a mobile application development framework Flutter, a developer of a quick application needs to check document object model (Document Object Model, abbreviated as DOM) information of a JS layer during debugging and needs to check DOM information of the Flutter layer for element positioning during testing.
How to facilitate the developer to view the DOM information of the JS layer and the Flutter layer when debugging and application is a problem to be solved at present.
Disclosure of Invention
The disclosure provides an information display method, an information display device, electronic equipment and a storage medium.
According to a first aspect of the present disclosure, there is provided an information display method, including:
receiving an initialization instruction sent by debugging equipment, wherein the initialization instruction comprises an identifier of an application to be tested;
initializing DOM data of the router thread corresponding to the identifier of the application to be tested to acquire first DOM information;
returning the first DOM information to the debugging equipment so that the debugging equipment performs information display based on the first DOM information;
Responding to the determination that the page of the application to be tested changes, and acquiring second DOM information of a JS layer in an application process of the application to be tested;
and sending the second DOM information to the debugging equipment so that the debugging equipment updates the currently displayed content.
According to a second aspect of the present disclosure, there is provided an information display method including:
sending an initialization instruction to an application process of an application to be tested in application test equipment, wherein the initialization instruction comprises an identification of the application to be tested;
receiving first DOM information of a router thread corresponding to the application to be tested, which is returned by the application testing equipment;
analyzing the first DOM information, and displaying the analyzed first DOM information on a visualization tool;
receiving second DOM information corresponding to a JS layer of the application to be tested, which is returned by the application testing equipment;
and updating the content currently displayed in the visualization tool based on the second DOM information.
According to a third aspect of the present disclosure, there is provided an information display apparatus comprising:
the first receiving module is used for receiving an initialization instruction sent by the debugging equipment, wherein the initialization instruction comprises an identifier of an application to be tested;
The first obtaining module is used for initializing DOM data of the router thread corresponding to the identifier of the application to be tested so as to obtain first DOM information;
the first return module is used for returning the first DOM information to the debugging equipment so that the debugging equipment can display information based on the first DOM information;
the second obtaining module is used for obtaining second DOM information of the JS layer in the application process of the application to be tested in response to the fact that the page of the application to be tested changes;
and the first updating module is used for sending the second DOM information to the debugging equipment so as to enable the debugging equipment to update the currently displayed content.
According to a fourth aspect of the present disclosure, there is provided an information display apparatus comprising:
the first sending module is used for sending an initialization instruction to an application process of an application to be tested in the application testing equipment, wherein the initialization instruction comprises an identification of the application to be tested;
the third receiving module is used for receiving the first DOM information of the Flutter thread corresponding to the application to be tested, which is returned by the application testing equipment;
the first analysis module is used for analyzing the first DOM information and displaying the analyzed first DOM information on the visualization tool;
The fourth receiving module is used for receiving second DOM information corresponding to the JS layer of the application to be tested, which is returned by the application testing equipment;
and the second updating module is used for updating the content currently displayed in the visualization tool based on the second DOM information.
An electronic device according to an embodiment of a fifth aspect of the present disclosure includes: a memory, a processor and a computer program stored on the memory and executable on the processor, the processor implementing the information presentation method as set forth in the first or second embodiments of the present disclosure when the program is executed.
A non-transitory computer-readable storage medium according to an embodiment of the sixth aspect of the present disclosure has stored thereon a computer program that, when executed by a processor, implements an information presentation method according to an embodiment of the first aspect or an embodiment of the second aspect of the present disclosure.
A computer program product according to an embodiment of a seventh aspect of the present disclosure, when instructions in the computer program product are executed by a processor, performs an information presentation method according to an embodiment of the first aspect or an embodiment of the second aspect of the present disclosure.
The following beneficial effects can be achieved through the present disclosure:
In the embodiment of the disclosure, an application test device firstly receives an initialization instruction sent by a debug device, wherein the initialization instruction includes an identifier of an application to be tested, then initializes DOM data of a router thread corresponding to the identifier of the application to be tested to obtain first DOM information, then returns the first DOM information to the debug device so that the debug device performs information display based on the first DOM information, then responds to the determination that a page of the application to be tested changes, obtains second DOM information of a JS layer in an application process of the application to be tested, and then sends the second DOM information to the debug device so that the debug device updates currently displayed content. Therefore, a developer of the Flutter thread can view DOM information of the JS layer in the process of debugging application, and also can view DOM information of the Flutter thread, development efficiency is improved, DOM data of the Flutter and DOM data of the JS layer can be processed in one debugging process, and adaptation of two modes is achieved.
In the embodiment of the disclosure, a debugging device firstly sends an initialization instruction to an application process of an application to be tested in an application testing device, the initialization instruction includes an identifier of the application to be tested, then receives first DOM information of a Flutter thread corresponding to the application to be tested returned by the application testing device, analyzes the first DOM information, displays the analyzed first DOM information on a visualization tool, then receives second DOM information corresponding to a JS layer of the application to be tested, which is returned by the application testing device, and updates content currently displayed in the visualization tool based on the second DOM information. Therefore, the debugging device obtains the corresponding second DOM information according to the change of the JS layer in the application to be tested by receiving and displaying the first DOM information of the Flutter thread, so that developers can view the DOM information of the two modes at the same time, and the two modes can be adapted.
It should be understood that the description in this section is not intended to identify key or critical features of the embodiments of the disclosure, nor is it intended to be used to limit the scope of the disclosure. Other features of the present disclosure will become apparent from the following specification.
Drawings
The drawings are for a better understanding of the present solution and are not to be construed as limiting the present disclosure. Wherein:
fig. 1 is a flowchart of an information presentation method provided according to a first embodiment of the present disclosure;
fig. 2 is a flowchart of an information presentation method provided according to a second embodiment of the present disclosure;
fig. 3 is a flowchart of an information presentation method provided according to a third embodiment of the present disclosure;
fig. 4 is a flowchart of an information presentation method provided according to a fourth embodiment of the present disclosure;
fig. 5 is a block diagram of an information presentation apparatus according to a fifth embodiment of the present disclosure;
fig. 6 is a block diagram of an information presentation apparatus according to a sixth embodiment of the present disclosure;
fig. 7 is a block diagram of an electronic device for implementing the information presentation method of an embodiment of the present disclosure.
Detailed Description
Exemplary embodiments of the present disclosure are described below in conjunction with the accompanying drawings, which include various details of the embodiments of the present disclosure to facilitate understanding, and should be considered as merely exemplary. Accordingly, one of ordinary skill in the art will recognize that various changes and modifications of the embodiments described herein can be made without departing from the scope and spirit of the present disclosure. Also, descriptions of well-known functions and constructions are omitted in the following description for clarity and conciseness.
Quick application (Quick App) is a novel application which is pushed out by each big mobile phone manufacturer based on a hardware platform, the Quick application is developed by using a front-end technology stack, native rendering is performed, and a developer can distribute the application to all intelligent terminals supporting industry standards for operation once.
Flutter framework framework layer (abbreviated as "Flutter layer" in this disclosure) is a responsive framework implemented in pure dart language that includes a rich set of platforms, layouts, and base libraries, consisting of a series of layers. From bottom layer to top layer are: basic classes and component services, such as animation, painting, and gestures, provide a common abstraction on an underlying basis. A tree of renderable objects may be built by the rendering layer. By dynamically manipulating these objects, the tree automatically updates the layout to reflect the changes.
In the embodiment of the disclosure, when testing a quick application, the dom information of the Flutter framework layer needs to be checked for element positioning. The application test device in the present disclosure may be a terminal device, such as a mobile phone, a car phone, a tablet, a wearable device, a television, etc., that is equipped with a universal terminal operating system for running a fast application, which is not limited herein.
Information presentation methods, apparatuses, electronic devices, and storage media of embodiments of the present disclosure are described below with reference to the accompanying drawings.
Fig. 1 is a flowchart of an information display method according to a first embodiment of the present disclosure.
The following description will be made with "application test equipment" as an execution subject of the information presentation method proposed by the first embodiment of the present disclosure.
As shown in fig. 1, the present disclosure provides an information display method, wherein the method includes:
step 101, receiving an initialization instruction sent by a debugging device, wherein the initialization instruction comprises an identifier of an application to be tested.
The application to be tested may be an application that needs to be tested currently.
In the embodiment of the disclosure, the application to be tested may be a fast application developed by using JS and rendered by using Flutter. During testing, a developer needs to check DOM information of the JS layer and DOM information of the Flutter layer of the application.
The initialization instruction (init DOM) may be a command sent by the debug device, and is used to instruct the application test device to initialize DOM information of the router layer.
Specifically, the application test device may communicate with the debug device based on the communication module, so that an application process of the application to be tested in the application test device may establish data communication with a debug process in the debug device, and thus the application process may receive the initialization instruction.
Step 102, initializing DOM data of the router thread corresponding to the identifier of the application to be tested to obtain first DOM information.
The first DOM information is DOM information after the DOM data of the router thread is initialized.
It should be noted that, by initializing DOM data of the router thread corresponding to the identifier of the application to be tested, the DOM data displayed by the debugging device may be the initial DOM information of the application to be tested.
And step 103, returning the first DOM information to the debugging equipment so that the debugging equipment can display information based on the first DOM information.
It should be noted that, when the debugging device performs information presentation based on the first DOM information, the visualization tool may be used to perform information presentation on the first DOM information in the developer tool window.
The visualization tool may be DevTools, or may be a pre-designed native hierarchical structure viewing tool suitable for testing an application to be tested, so that first DOM information of the application to be tested may be viewed.
In the embodiment of the disclosure, the debugging device may determine, according to the first DOM information of the application to be tested, a front display screen of the current application to be tested, a code corresponding to a DOM node of each UI element in the page, a tag, an attribute, and the like corresponding to each DOM node, which are not limited herein.
And 104, responding to the determination that the page of the application to be tested changes, and acquiring second DOM information of the JS layer in the application process of the application to be tested.
The second DOM information may be DOM data obtained from the JS thread, which may cause a change in a page of the application to be tested.
For example, if the current JS thread includes DOM data a and B, and the user clicks a button in the page, the text in the page changes, and the corresponding change of DOM data a and B is DOM data A, B, C, DOM data C may be used as the second DOM information, which is not limited herein.
It will be appreciated that the JS thread will send the generated DOM data to the Flutter thread to enable the Flutter thread to render and draw page images. If the DOM data in the JS thread changes, the DOM data of the Flutter thread is affected.
Optionally, the application test device may monitor an application process of the application to be tested based on a preset monitoring module, so as to determine whether a page change event is generated in the application process, and then, in response to determining that the page change event is generated in the application process, acquire second DOM information of the JS layer in the application process.
The monitoring module may be preset in an application process of the application to be tested, so that the application process may monitor to obtain DOM data appearing in the JS thread at each moment, so as to determine whether a page change event is generated according to the DOM data.
For example, the page change event may be any event that may cause a change in DOM data in the JS thread, such as playing a video, viewing scrolling text, causing a switch between pages due to a key press, etc.
Thus, the application test device can capture these page change events, i.e., can capture relevant DOM data, i.e., second DOM information, from the JS thread that can cause a page change based on the listening module.
Step 105, sending the second DOM information to the debugging device, so that the debugging device updates the currently displayed content.
Specifically, after sending the second DOM information to the debug device, the debug device may update the currently displayed content, such as adjusting the displayed page, according to the second DOM information, thereby determining a changed page according to the second DOM information, and updating the currently displayed first DOM information.
In the embodiment of the disclosure, an application test device firstly receives an initialization instruction sent by a debug device, wherein the initialization instruction includes an identifier of an application to be tested, then initializes DOM data of a router thread corresponding to the identifier of the application to be tested to obtain first DOM information, then returns the first DOM information to the debug device so that the debug device performs information display based on the first DOM information, then responds to the determination that a page of the application to be tested changes, obtains second DOM information of a JS layer in an application process of the application to be tested, and then sends the second DOM information to the debug device so that the debug device updates currently displayed content. Therefore, a developer of the Flutter thread can view DOM information of the JS layer in the process of debugging application, and also can view DOM information of the Flutter thread, development efficiency is improved, DOM data of the Flutter and DOM data of the JS layer can be processed in one debugging process, and adaptation of two modes is achieved.
Fig. 2 is a flowchart of an information display method according to a second embodiment of the present disclosure.
The following description will be made with "application test equipment" as an execution subject of the information presentation method proposed by the second embodiment of the present disclosure.
As shown in fig. 2, the present disclosure provides an information display method, wherein the method includes:
step 201, receiving an application starting instruction sent by the debugging device based on a preset resident service process, wherein the application starting instruction contains an identifier of the application to be tested.
Wherein the resident service process can be used for controlling the application to be tested to start and close.
After the user inputs the viewing parameter through the debugging device, the debugging device may send an application start instruction to the resident service process of the application test device, so that the resident service process starts the application process of the application.
Step 202, controlling the resident service process to start the application to be tested.
And 203, obtaining third DOM information of the JS layer in the application process to be tested.
The third DOM information may include a tag, an attribute, a style, a content, and the like of a DOM node corresponding to each UI element in the page of the application to be tested. I.e., a collection of information for DOM nodes for all UI elements in the user interface. The third DOM information may be DOM information that can change the current page, or may include JS information, CSS information, and the like, and is not limited thereto.
Optionally, after the application to be tested is started, the application testing device may acquire third DOM information of the JS thread in the application process to be tested.
And step 204, sending the third DOM information to the debugging equipment so that the debugging equipment can display information based on the third DOM information.
Optionally, the third DOM information is sent to the debugging device, and the third DOM information may be exposed by the debugging device according to the visualization tool.
The visualization tool may be DevTools, or may be a pre-designed native hierarchical structure viewing tool suitable for testing applications to be tested.
In the embodiment of the disclosure, a native hierarchy viewing tool (UI interface layout hierarchy viewer) for viewing an application to be tested may be built in advance. It should be noted that, the third DOM information may be displayed in a partition by the UI interface layout hierarchical viewer, for example, a tab area, a picture area, an attribute display area, a DOM tree display area, and the like, which are not limited herein. Wherein the attribute display area displays all attributes and contents of the currently selected element.
In the embodiment of the disclosure, an application test device first receives an application start instruction sent by a debug device based on a preset resident service process, wherein the application start instruction includes an identifier of an application to be tested, then controls the resident service process to start the application to be tested, then obtains third DOM information of a JS layer in the application process to be tested, and finally sends the third DOM information to the debug device, so that the debug device performs information display based on the third DOM information. Therefore, after the application is started, the DOM information corresponding to the current page can be sent to the debugger for display in real time by utilizing the JS thread, so that a developer can view the DOM information.
Fig. 3 is a flowchart of an information display method according to a third embodiment of the present disclosure.
The information display method provided by the third embodiment of the present disclosure may be executed by the application test apparatus provided by the present disclosure. The "debugging device" is used as an execution subject of the information presentation method proposed by the third embodiment of the present disclosure.
As shown in fig. 3, the present disclosure provides an information display method, wherein the method includes:
step 301, an initialization instruction is sent to an application process of an application to be tested in the application test device, where the initialization instruction includes an identifier of the application to be tested.
The application to be tested may be an application that needs to be tested currently.
In the embodiment of the disclosure, the application to be tested may be a fast application developed by using JS and rendered by using Flutter. During testing, a developer needs to check DOM information of the JS layer and DOM information of the Flutter layer of the application.
The initialization instruction (init DOM) may be a command sent by the debug device, and is used to instruct the application test device to initialize DOM information of the router layer.
Specifically, the debugging device may communicate with the application test device based on the communication module, so that an application process of the application to be tested in the application test device may establish data communication with a debugging process in the debugging device, so that the debugging device may send the initialization instruction.
Specifically, when a developer starts the debugging device and inputs a UI debugging (UI debug) parameter in the front end of the debugger, the debugging device can send an initialization instruction to an application process of an application to be tested in the application test device through a remote procedure call (Remote Procedure Call, RPC) based on the debugging process.
Optionally, after the debug device receives the debug instruction, the debug device may send an initialization instruction to the application to be tested of the application identifier to be tested included in the debug instruction.
Step 302, receiving first DOM information of a router thread corresponding to the application to be tested returned by the application test device.
After the initialization instruction is sent, the application test device initializes the DOM data process of the Flutter thread, returns initialized first DOM information to the debugging device, and the debugging device receives the initialized first DOM information.
And step 303, analyzing the first DOM information, and displaying the analyzed first DOM information on the visualization tool.
It should be noted that, because the application test device and the debug device communicate based on the network protocol, after the first DOM information is received, it is also required to parse the first DOM information, so that the first DOM information is converted into a standard format and then displayed in the visualization tool.
In the embodiment of the present disclosure, a visualization tool (UI interface layout hierarchy viewer) for viewing the UI layout hierarchy may be built in advance as the visualization tool. It should be noted that, the second DOM information may be displayed in a partition by the UI interface layout hierarchical viewer, for example, a tab area, a picture area, an attribute display area, a DOM tree display area, and the like, which are not limited herein.
Wherein the attribute display area displays all attributes and contents of the currently selected element.
And step 304, receiving second DOM information corresponding to the JS layer of the application to be tested, which is returned by the application testing device.
And step 305, updating the content currently displayed in the visualization tool based on the second DOM information.
It should be noted that, if the debugging device receives the second DOM information corresponding to the JS layer of the application to be tested returned by the application test device, the content currently displayed in the visualization tool may be updated according to the second DOM information.
In the embodiment of the disclosure, a debugging device firstly sends an initialization instruction to an application process of an application to be tested in an application testing device, the initialization instruction includes an identifier of the application to be tested, then receives first DOM information of a Flutter thread corresponding to the application to be tested returned by the application testing device, analyzes the first DOM information, displays the analyzed first DOM information on a visualization tool, then receives second DOM information corresponding to a JS layer of the application to be tested, which is returned by the application testing device, and updates content currently displayed in the visualization tool based on the second DOM information. Therefore, the debugging device obtains the corresponding second DOM information according to the change of the JS layer in the application to be tested by receiving and displaying the first DOM information of the Flutter thread, so that developers can view the DOM information of the two modes at the same time, and the two modes can be adapted.
Fig. 4 is a flowchart of an information display method according to a fourth embodiment of the present disclosure.
The information display method provided by the fourth embodiment of the present disclosure may be executed by the application test apparatus provided by the present disclosure. The "debugging device" is used as an execution subject of the information presentation method proposed by the fourth embodiment of the present disclosure.
As shown in fig. 4, the present disclosure provides an information display method, wherein the method includes:
step 401, an application starting instruction is sent to a resident service process in the application test device, so that the resident service process starts an application to be tested, and the starting instruction includes an identifier of the application to be tested.
Specifically, when the developer inputs the viewing parameters based on the front-end display interface of the debugging device, the debugging device can generate a viewing instruction to view the front-end condition of the application to be tested. The debugging device may first send an application start instruction to a resident service process in the application test device, so that the resident service process starts an application to be tested.
And step 402, receiving third DOM information corresponding to the JS layer of the application to be tested, which is returned by the application test device.
Specifically, the debugging device may communicate with the application test device based on the communication module, so that an application process of the application to be tested in the application test device may establish data communication with a debugging process in the debugging device, so that the debugging process may receive the third DOM information.
The third DOM information may include a tag, an attribute, a style, a content, and the like of a DOM node corresponding to each UI element in the page of the application to be tested. I.e., a collection of information for DOM nodes for all UI elements in the user interface. The third DOM information may be DOM information that can change the current page, or may include JS information, CSS information, and the like, and is not limited thereto.
And step 403, analyzing the third DOM information, and displaying the analyzed third DOM information on the visualization tool.
Optionally, after parsing the third DOM information, the debugging device may utilize a visualization tool to display the parsed third DOM information.
The visualization tool may be DevTools, or may be a pre-designed native hierarchical structure viewing tool suitable for testing applications to be tested.
In the embodiment of the disclosure, a native hierarchy viewing tool (UI interface layout hierarchy viewer) for viewing an application to be tested may be built in advance. It should be noted that, the third DOM information may be displayed in a partition by the UI interface layout hierarchical viewer, for example, a tab area, a picture area, an attribute display area, a DOM tree display area, and the like, which are not limited herein. Wherein the attribute display area displays all attributes and contents of the currently selected element.
In the embodiment of the disclosure, the debugging device first sends an application starting instruction to a resident service process in the application testing device, so that the resident service process starts an application to be tested, the starting instruction includes an identifier of the application to be tested, then receives third DOM information corresponding to a JS layer of the application to be tested, returned by the application testing device, analyzes the third DOM information, and displays the analyzed third DOM information on a visualization tool. Therefore, after the application is started, the debugger can utilize the DOM information currently sent by the JS thread in real time and display the DOM information, so that a developer can debug the DOM information.
Fig. 5 is a schematic structural diagram of an information display device according to an embodiment of the disclosure.
As shown in fig. 5, the information presentation apparatus 500 includes:
a first receiving module 510, configured to receive an initialization instruction sent by a debug device, where the initialization instruction includes an identifier of an application to be tested;
the first obtaining module 520 is configured to initialize DOM data of a router thread corresponding to the identifier of the application to be tested, so as to obtain first DOM information;
a first return module 530, configured to return the first DOM information to the debug device, so that the debug device performs information presentation based on the first DOM information;
a second obtaining module 540, configured to obtain second DOM information of the JS layer in an application process of the application to be tested in response to determining that the page of the application to be tested changes;
and the first updating module 550 is configured to send the second DOM information to the debugging device, so that the debugging device updates the currently presented content.
Optionally, the second obtaining module is specifically configured to:
based on a preset monitoring module, monitoring the application process of the application to be tested to judge whether a page change event is generated in the application process;
And responding to the determination that the page change event is generated in the application process, and acquiring second DOM information of the JS layer in the application process.
Optionally, the apparatus further includes:
the second receiving module is used for receiving an application starting instruction sent by the debugging equipment based on a preset resident service process, wherein the application starting instruction comprises an identification of the application to be tested;
the control module is used for controlling the resident service process to start the application to be tested;
the third obtaining module is used for obtaining third DOM information of the JS layer in the application process to be tested;
and the display module is used for sending the third DOM information to the debugging equipment so that the debugging equipment can display information based on the third DOM information.
In the embodiment of the disclosure, an application test device firstly receives an initialization instruction sent by a debug device, wherein the initialization instruction includes an identifier of an application to be tested, then initializes DOM data of a router thread corresponding to the identifier of the application to be tested to obtain first DOM information, then returns the first DOM information to the debug device so that the debug device performs information display based on the first DOM information, then responds to the determination that a page of the application to be tested changes, obtains second DOM information of a JS layer in an application process of the application to be tested, and then sends the second DOM information to the debug device so that the debug device updates currently displayed content. Therefore, a developer of the Flutter thread can view DOM information of the JS layer in the process of debugging application, and also can view DOM information of the Flutter thread, development efficiency is improved, DOM data of the Flutter and DOM data of the JS layer can be processed in one debugging process, and adaptation of two modes is achieved.
As shown in fig. 6, the information presentation apparatus 600 includes:
a first sending module 610, configured to send an initialization instruction to an application process of an application to be tested in the application testing device, where the initialization instruction includes an identifier of the application to be tested;
a third receiving module 620, configured to receive first DOM information of a router thread corresponding to the application to be tested, which is returned by the application testing device;
the first parsing module 630 is configured to parse the first DOM information, and display the parsed first DOM information on a visualization tool;
a fourth receiving module 640, configured to receive second DOM information corresponding to the JS layer of the application to be tested, which is returned by the application testing device;
and a second updating module 650, configured to update the content currently displayed in the visualization tool based on the second DOM information.
Optionally, the apparatus further includes:
the second sending module is used for sending an application starting instruction to a resident service process in the application testing equipment so that the resident service process starts an application to be tested, and the starting instruction comprises an identification of the application to be tested;
a fifth receiving module, configured to receive third DOM information corresponding to the JS layer of the application to be tested, which is returned by the application testing device;
And the second analysis module is used for analyzing the third DOM information and displaying the analyzed third DOM information on the visualization tool.
In the embodiment of the disclosure, a debugging device firstly sends an initialization instruction to an application process of an application to be tested in an application testing device, the initialization instruction includes an identifier of the application to be tested, then receives first DOM information of a Flutter thread corresponding to the application to be tested returned by the application testing device, analyzes the first DOM information, displays the analyzed first DOM information on a visualization tool, then receives second DOM information corresponding to a JS layer of the application to be tested, which is returned by the application testing device, and updates content currently displayed in the visualization tool based on the second DOM information. Therefore, the debugging device obtains the corresponding second DOM information according to the change of the JS layer in the application to be tested by receiving and displaying the first DOM information of the Flutter thread, so that developers can view the DOM information of the two modes at the same time, and the two modes can be adapted.
Fig. 6 is a schematic structural diagram of an information display device according to an embodiment of the disclosure.
According to embodiments of the present disclosure, the present disclosure also provides an electronic device, a readable storage medium and a computer program product.
Fig. 7 illustrates a schematic block diagram of an example electronic device 700 that may be used to implement embodiments of the present disclosure. Electronic devices are intended to represent various forms of digital computers, such as laptops, desktops, workstations, personal digital assistants, servers, blade servers, mainframes, and other appropriate computers. The electronic device may also represent various forms of mobile devices, such as personal digital processing, cellular telephones, smartphones, wearable devices, and other similar computing devices. The components shown herein, their connections and relationships, and their functions, are meant to be exemplary only, and are not meant to limit implementations of the disclosure described and/or claimed herein.
As shown in fig. 7, the apparatus 700 includes a computing unit 701 that can perform various appropriate actions and processes according to a computer program stored in a Read Only Memory (ROM) 702 or a computer program loaded from a storage unit 708 into a Random Access Memory (RAM) 703. In the RAM 703, various programs and data required for the operation of the device 700 may also be stored. The computing unit 701, the ROM 702, and the RAM 703 are connected to each other through a bus 704. An input/output (I/O) interface 705 is also connected to bus 704.
Various components in device 700 are connected to I/O interface 705, including: an input unit 706 such as a keyboard, a mouse, etc.; an output unit 707 such as various types of displays, speakers, and the like; a storage unit 708 such as a magnetic disk, an optical disk, or the like; and a communication unit 709 such as a network card, modem, wireless communication transceiver, etc. The communication unit 709 allows the device 700 to exchange information/data with other devices via a computer network, such as the internet, and/or various telecommunication networks.
The computing unit 701 may be a variety of general and/or special purpose processing components having processing and computing capabilities. Some examples of computing unit 701 include, but are not limited to, a Central Processing Unit (CPU), a Graphics Processing Unit (GPU), various specialized Artificial Intelligence (AI) computing chips, various computing units running machine learning model algorithms, a Digital Signal Processor (DSP), and any suitable processor, controller, microcontroller, etc. The computing unit 701 performs the respective methods and processes described above, such as the information presentation method. For example, in some embodiments, the information presentation method may be implemented as a computer software program tangibly embodied on a machine-readable medium, such as storage unit 708. In some embodiments, part or all of the computer program may be loaded and/or installed onto device 700 via ROM 702 and/or communication unit 709. When a computer program is loaded into the RAM 703 and executed by the computing unit 701, one or more steps of the information presentation method described above may be performed. Alternatively, in other embodiments, the computing unit 701 may be configured to perform the information presentation method by any other suitable means (e.g. by means of firmware).
Various implementations of the systems and techniques described here above may be implemented in digital electronic circuitry, integrated circuit systems, field Programmable Gate Arrays (FPGAs), application Specific Integrated Circuits (ASICs), application Specific Standard Products (ASSPs), systems On Chip (SOCs), load programmable logic devices (CPLDs), computer hardware, firmware, software, and/or combinations thereof. These various embodiments may include: implemented in one or more computer programs, the one or more computer programs may be executed and/or interpreted on a programmable system including at least one programmable processor, which may be a special purpose or general-purpose programmable processor, that may receive data and instructions from, and transmit data and instructions to, a storage system, at least one input device, and at least one output device.
Program code for carrying out methods of the present disclosure may be written in any combination of one or more programming languages. These program code may be provided to a processor or controller of a general purpose computer, special purpose computer, or other programmable data processing apparatus such that the program code, when executed by the processor or controller, causes the functions/operations specified in the flowchart and/or block diagram to be implemented. The program code may execute entirely on the machine, partly on the machine, as a stand-alone software package, partly on the machine and partly on a remote machine or entirely on the remote machine or server.
In the context of this disclosure, a machine-readable medium may be a tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. The machine-readable medium may be a machine-readable signal medium or a machine-readable storage medium. The machine-readable medium may include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any suitable combination of the foregoing. More specific examples of a machine-readable storage medium would include an electrical connection based on one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.
To provide for interaction with a user, the systems and techniques described here can be implemented on a computer having: a display device (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor) for displaying information to a user; and a keyboard and pointing device (e.g., a mouse or trackball) by which a user can provide input to the computer. Other kinds of devices may also be used to provide for interaction with a user; for example, feedback provided to the user may be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user may be received in any form, including acoustic input, speech input, or tactile input.
The systems and techniques described here can be implemented in a computing system that includes a background component (e.g., as a data server), or that includes a middleware component (e.g., an application server), or that includes a front-end component (e.g., a user computer having a graphical user interface or a web browser through which a user can interact with an implementation of the systems and techniques described here), or any combination of such background, middleware, or front-end components. The components of the system can be interconnected by any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include: local Area Networks (LANs), wide Area Networks (WANs), the internet, and blockchain networks.
The computer system may include a client and a server. The client and server are typically remote from each other and typically interact through a communication network. The relationship of client and server arises by virtue of computer programs running on the respective computers and having a client-server relationship to each other. The server can be a cloud server, also called a cloud computing server or a cloud host, and is a host product in a cloud computing service system, so that the defects of high management difficulty and weak service expansibility in the traditional physical hosts and VPS service ("Virtual Private Server" or simply "VPS") are overcome. The server may also be a server of a distributed system or a server that incorporates a blockchain.
It should be appreciated that various forms of the flows shown above may be used to reorder, add, or delete steps. For example, the steps recited in the present disclosure may be performed in parallel or sequentially or in a different order, provided that the desired results of the technical solutions of the present disclosure are achieved, and are not limited herein.
The above detailed description should not be taken as limiting the scope of the present disclosure. It will be apparent to those skilled in the art that various modifications, combinations, sub-combinations and alternatives are possible, depending on design requirements and other factors. Any modifications, equivalent substitutions and improvements made within the spirit and principles of the present disclosure are intended to be included within the scope of the present disclosure.

Claims (13)

1. An information presentation method, the method being performed by an application test device, comprising:
receiving an initialization instruction sent by debugging equipment, wherein the initialization instruction comprises an identifier of an application to be tested;
initializing Document Object Model (DOM) data of a mobile application development framework (Flutter) thread corresponding to the identification of the application to be tested to acquire first DOM information;
Returning the first DOM information to the debugging equipment so that the debugging equipment performs information display based on the first DOM information;
responding to the determination that the page of the application to be tested changes, and acquiring second DOM information of a JS layer in an application process of the application to be tested;
and sending the second DOM information to the debugging equipment so that the debugging equipment updates the currently displayed content.
2. The method according to claim 1, wherein the obtaining, in response to determining that the page of the application to be tested changes, the second DOM information of the JS layer in the application process of the application to be tested includes:
based on a preset monitoring module, monitoring the application process of the application to be tested to judge whether a page change event is generated in the application process;
and responding to the determination that the page change event is generated in the application process, and acquiring second DOM information of the JS layer in the application process.
3. The method as recited in claim 1, further comprising:
receiving an application starting instruction sent by the debugging equipment based on a preset resident service process, wherein the application starting instruction comprises an identification of the application to be tested;
Controlling the resident service process to start the application to be tested;
acquiring third DOM information of a JS layer in the application process to be tested;
and sending the third DOM information to the debugging equipment so that the debugging equipment can display information based on the third DOM information.
4. An information presentation method, the method being performed by a debugging device, comprising:
sending an initialization instruction to an application process of an application to be tested in application test equipment, wherein the initialization instruction comprises an identification of the application to be tested;
receiving first DOM information of a router thread corresponding to the application to be tested, which is returned by the application testing equipment;
analyzing the first DOM information, and displaying the analyzed first DOM information on a visualization tool;
receiving second DOM information corresponding to a JS layer of the application to be tested, which is returned by the application testing equipment;
and updating the content currently displayed in the visualization tool based on the second DOM information.
5. The method as recited in claim 1, further comprising:
sending an application starting instruction to a resident service process in the application test equipment so that the resident service process starts an application to be tested, wherein the starting instruction comprises an identification of the application to be tested;
Receiving third DOM information corresponding to the JS layer of the application to be tested, which is returned by the application testing equipment;
and analyzing the third DOM information, and displaying the analyzed third DOM information on a visualization tool.
6. An information display device, comprising:
the first receiving module is used for receiving an initialization instruction sent by the debugging equipment, wherein the initialization instruction comprises an identifier of an application to be tested;
the first obtaining module is used for initializing DOM data of the router thread corresponding to the identifier of the application to be tested so as to obtain first DOM information;
the first return module is used for returning the first DOM information to the debugging equipment so that the debugging equipment can display information based on the first DOM information;
the second obtaining module is used for obtaining second DOM information of the JS layer in the application process of the application to be tested in response to the fact that the page of the application to be tested changes;
and the first updating module is used for sending the second DOM information to the debugging equipment so as to enable the debugging equipment to update the currently displayed content.
7. The apparatus of claim 6, wherein the second acquisition module is specifically configured to:
Based on a preset monitoring module, monitoring the application process of the application to be tested to judge whether a page change event is generated in the application process;
and responding to the determination that the page change event is generated in the application process, and acquiring second DOM information of the JS layer in the application process.
8. The apparatus as recited in claim 6, further comprising:
the second receiving module is used for receiving an application starting instruction sent by the debugging equipment based on a preset resident service process, wherein the application starting instruction comprises an identification of the application to be tested;
the control module is used for controlling the resident service process to start the application to be tested;
the third obtaining module is used for obtaining third DOM information of the JS layer in the application process to be tested;
and the display module is used for sending the third DOM information to the debugging equipment so that the debugging equipment can display information based on the third DOM information.
9. An information display device, comprising:
the first sending module is used for sending an initialization instruction to an application process of an application to be tested in the application testing equipment, wherein the initialization instruction comprises an identification of the application to be tested;
The third receiving module is used for receiving the first DOM information of the Flutter thread corresponding to the application to be tested, which is returned by the application testing equipment;
the first analysis module is used for analyzing the first DOM information and displaying the analyzed first DOM information on the visualization tool;
the fourth receiving module is used for receiving second DOM information corresponding to the JS layer of the application to be tested, which is returned by the application testing equipment;
and the second updating module is used for updating the content currently displayed in the visualization tool based on the second DOM information.
10. The apparatus as recited in claim 6, further comprising:
the second sending module is used for sending an application starting instruction to a resident service process in the application testing equipment so that the resident service process starts an application to be tested, and the starting instruction comprises an identification of the application to be tested;
a fifth receiving module, configured to receive third DOM information corresponding to the JS layer of the application to be tested, which is returned by the application testing device;
and the second analysis module is used for analyzing the third DOM information and displaying the analyzed third DOM information on the visualization tool.
11. An electronic device, comprising:
at least one processor; and
a memory communicatively coupled to the at least one processor; wherein,
the memory stores instructions executable by the at least one processor to enable the at least one processor to perform the method of any one of claims 1-3 or the method of any one of claims 4-5.
12. A non-transitory computer readable storage medium storing computer instructions, wherein the computer instructions are for causing the computer to perform the method of any one of claims 1-3 or the method of any one of claims 4-5.
13. A computer program product comprising a computer program which, when executed by a processor, implements the method of any one of claims 1-3 or the method of any one of claims 4-5.
CN202211199700.9A 2022-09-29 2022-09-29 Information display method, device, electronic equipment and storage medium Pending CN117827628A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202211199700.9A CN117827628A (en) 2022-09-29 2022-09-29 Information display method, device, electronic equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202211199700.9A CN117827628A (en) 2022-09-29 2022-09-29 Information display method, device, electronic equipment and storage medium

Publications (1)

Publication Number Publication Date
CN117827628A true CN117827628A (en) 2024-04-05

Family

ID=90516095

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202211199700.9A Pending CN117827628A (en) 2022-09-29 2022-09-29 Information display method, device, electronic equipment and storage medium

Country Status (1)

Country Link
CN (1) CN117827628A (en)

Similar Documents

Publication Publication Date Title
CN109361948B (en) Interface management method, intelligent terminal and readable storage medium
CN110020293B (en) Multimedia data display method, device and storage medium
CN113010827B (en) Page rendering method and device, electronic equipment and storage medium
CN111209065B (en) Dynamic wallpaper setting method and device, storage medium and electronic equipment
CN107045546B (en) Webpage processing method and device and intelligent terminal
CN109582317B (en) Method and apparatus for debugging hosted applications
CN115309470B (en) Method, device, equipment and storage medium for loading widget
CN112835579A (en) Method and device for determining interface code, electronic equipment and storage medium
CN111240776B (en) Dynamic wallpaper setting method and device, storage medium and electronic equipment
CN112015468A (en) Interface document processing method and device, electronic equipment and storage medium
CN113655975A (en) Image display method, image display device, electronic apparatus, and medium
CN111783010B (en) Webpage blank page monitoring method, device, terminal and storage medium
CN113905040B (en) File transmission method, device, system, equipment and storage medium
CN117827628A (en) Information display method, device, electronic equipment and storage medium
CN106383705B (en) Method and device for setting mouse display state in application thin client
CN108491230A (en) Cartoon display method and device, client
CN114389969A (en) Client test method and device, electronic equipment and storage medium
CN112367295A (en) Plug-in display method and device, storage medium and electronic equipment
CN111913711A (en) Video rendering method and device
CN114398131B (en) Information display method, device, equipment, medium and program product
CN114546199B (en) Image processing method, device, electronic equipment and storage medium
CN117762767A (en) Display method and device of user interface, electronic equipment and storage medium
CN115202538B (en) Menu configuration method and device, electronic equipment and storage medium
CN115858364A (en) Method and system for testing application starting time of cloud terminal
CN116881121A (en) Test method, test device, electronic equipment and computer readable storage medium

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination