Processing method, device, equipment, medium and product

Abstract

The invention discloses a processing method and device, equipment, a medium and a product in the technical field of computers, and the method comprises the steps: for a target file existing in a project file of a target application, when the target file is a part of the project file, if an operation of opening the target file is detected, opening the target file; if yes, analyzing the target file to obtain an abstract syntax tree, so that the abstract syntax tree can describe the target file in a tree structure; and identifying at least one component from the abstract syntax tree, so that the at least one component can represent the component appearing in the target file, and the component is automatically identified from the file. Visibly, only the currently opened file is analyzed, so that the time overhead and the resource overhead are greatly reduced, the defects caused by simultaneous analysis of all files in the project file can be effectively overcome, the memory occupation and the CPU load can be greatly reduced, the fluency can be improved, and the user experience can be improved. And the user experience is improved.

Description

Technical Field

[0001] This application relates to the field of computer technology, and in particular, to a processing method, apparatus, device, medium, and product. Background Art

[0002] With the gradual development of front-end development, the component-based architecture has gradually become the mainstream. Among them, the componentization is specifically: disassembling an application (App) into reusable, independent, and well-encapsulated modules (such as code blocks, etc.), so that each module can be used as a component with its own business logic and user interface (UI) performance, thereby enabling the APP to include multiple components, and thus making it beneficial to improve development efficiency, enhance code reusability, and reduce maintenance costs through componentization.

[0003] In addition, in a componentized App, components are used as the smallest business units to complete some functional logic and UI rendering tasks. Therefore, in order to ensure the stability and user experience of the App, these components need to undergo some tests, such as unit tests, integration tests, end-to-end tests, etc.

[0004] Furthermore, the above tests have the following requirements: identifying each component from the relevant files (such as project files) of the App, so that subsequent corresponding tests can be performed on each component. Thus, how to identify components from files has become an urgent technical problem to be solved. Among them, the project file refers to various documents and resources generated during the App development process, so that the project file includes source code files, resource files, and configuration files, etc., thereby enabling the APP to be implemented based on the project file. Summary of the Invention

[0005] To solve the above technical problems, this application provides a processing method, apparatus, device, medium, and product.

[0006] To achieve the above object, the technical solutions provided by this application are as follows:

[0007] This application provides a processing method, the method includes: for a target file existing in a project file of a target application, in response to an operation of opening the target file, parsing the target file to obtain an abstract syntax tree, where the target file is a part of the project file; identifying at least one component from the abstract syntax tree.

[0008] In a possible implementation, parsing the target file to obtain an abstract syntax tree includes: in response to the type of the target file belonging to a preset file type set, parsing the target file to obtain the abstract syntax tree, where the preset file type set is determined according to the types of files in which the component has appeared.

[0009] In a possible implementation, the parsing the target file to obtain an abstract syntax tree in response to an operation of opening the target file includes: in response to the operation of opening the target file, loading the target file; in response to the completion of loading the target file, parsing the target file to obtain the abstract syntax tree.

[0010] In a possible implementation, parsing the target file to obtain an abstract syntax tree includes: in response to the volume of the target file being greater than a preset volume threshold, separately parsing multiple content blocks divided from the target file to obtain the abstract syntax trees of the respective content blocks, and the parsing processes of different content blocks occupy different time periods.

[0011] In a possible implementation, before identifying at least one component from the abstract syntax tree, the method further includes: for any node in the abstract syntax tree, in response to the type of the node belonging to a pre - defined node type set, deleting the node from the abstract syntax tree, where the pre - defined node type set indicates the types of nodes that do not belong to the component.

[0012] In a possible implementation, identifying at least one component from the abstract syntax tree includes: for any node in the abstract syntax tree, in response to the type of the node being a syntax declaration for exporting a default module, a function declaration, a variable declaration, or an arrow function expression, obtaining an analysis result of the return value of the node; in response to the analysis result indicating that the return value of the node belongs to an interface element, determining the at least one component based on the node, where the at least one component includes the content indicated by the node in the target file, and determining the component type of the content indicated by the node in the target file as a function component, and the interface element is used to describe the application interface of the target application.

[0013] In a possible implementation, after obtaining the analysis result of the return value of the node, the method further includes: in response to the type of the node being the variable declaration and the analysis result indicating that the return value of the node does not belong to an interface element, obtaining the matching result between the node and each name in at least one high-order component name; in response to the matching result indicating that there is a name in the at least one high-order component name that matches the node, determining the at least one component based on the node, where the at least one component includes the content indicated by the node in the target file, and determining the component type of the content indicated by the node in the target file as the high-order component indicated by the name that matches the node.

[0014] In a possible implementation, the identifying at least one component from the abstract syntax tree includes: for any node in the abstract syntax tree, in response to the type of the node being the class declaration, obtaining the analysis result of the node; in response to the analysis result indicating that the node inherits the abstract base class for defining class components and the return value of the rendering method in the node belongs to an interface element, determining the at least one component based on the node, where the at least one component includes the content indicated by the node in the target file, and determining the component type of the content indicated by the node in the target file as a class component, and the interface element is used to describe the application interface of the target application.

[0015] In a possible implementation, the method further includes: for any one of the components, adding an interactive control corresponding to the component to the target file according to the position of the component in the target file, where the distance between the position of the interactive control in the target file and the position of the component in the target file is less than a preset distance threshold, and the interactive control is used to trigger at least one process for the component, and the at least one process includes at least one test.

[0016] In a possible implementation, after identifying at least one component from the abstract syntax tree, the method further includes: in response to an edit operation on the target file, updating the target file according to the edit operation, and continuing to execute the step of parsing the target file to obtain the abstract syntax tree.

[0017] In a possible implementation, after identifying at least one component from the abstract syntax tree, the method further includes: in response to an edit operation on the target file, updating the target file according to the edit operation; updating the at least one component according to the change of the updated target file relative to the target file before the update, and the updated at least one component indicates the components existing in the updated target file.

[0018] In a possible implementation manner, the method is applied to a code editor.

[0019] The present application provides a processing device, including: a parsing unit, configured to, for a target file existing in a project file of a target application, in response to an operation of opening the target file, parse the target file to obtain an abstract syntax tree, where the target file is a part of the project file; and an identifying unit, configured to identify at least one component from the abstract syntax tree.

[0020] The present application provides an electronic device, where the device includes: a processor and a memory; the memory is configured to store instructions or computer programs; the processor is configured to execute the instructions or computer programs in the memory, so that the electronic device executes the processing method provided by the present application.

[0021] The present application provides a computer-readable medium, where instructions or computer programs are stored in the computer-readable medium, and when the instructions or computer programs run on a device, the device is caused to execute the processing method provided by the present application.

[0022] The present application provides a computer program product, which includes a computer program carried on a non-transitory computer-readable medium, and the computer program includes program codes for executing the processing method provided by the present application.

[0023] Compared with the related art, the present application has at least the following advantages:

[0024] In the technical solution provided by the present application, for a target file existing in a project file of a target application, when the target file is a part of the project file (for example, the target file is any file existing in the project file), if an operation of opening the target file is detected, the target file is first parsed to obtain an abstract syntax tree (AST), so that the abstract syntax tree can describe the target file in a tree structure; then at least one component is identified from the abstract syntax tree, so that the at least one component can represent the components appearing in the target file, and thus automatic identification of components from the file can be realized. It can be seen that the present application only analyzes the currently opened file (such as parsing and component identification), greatly reducing the time overhead and resource overhead, and thus can effectively overcome the defects caused by analyzing all files in the project file at the same time (such as excessive resource overhead or excessive time overhead, etc.), which is beneficial to greatly reducing the memory occupation and the load of the Central Processing Unit (CPU), and further beneficial to improving the fluency to improve the user experience. BRIEF DESCRIPTION OF THE DRAWINGS

[0025] To more clearly illustrate the technical solutions in the embodiments of the present application or related technologies, the following will briefly introduce the accompanying drawings required for the description of the embodiments or related technologies. Obviously, the accompanying drawings in the following description are only some embodiments recorded in the present application. For those of ordinary skill in the art, without creative efforts, other accompanying drawings can be obtained based on these drawings.

[0026] Figure 1 It is a flowchart of a processing method provided by an embodiment of the present application;

[0027] Figure 2 It is a schematic diagram of an interactive control provided by an embodiment of the present application;

[0028] Figure 3 It is a schematic structural diagram of a processing device provided by an embodiment of the present application;

[0029] Figure 4 It is a schematic structural diagram of an electronic device provided by an embodiment of the present application. Detailed implementation manners

[0030] It has been found through research that in some scenarios, for the project file of any application program, relevant personnel can manually analyze which components exist in all files in the project file.

[0031] It has also been found through research that the above - shown solution has the following defects: Since relevant personnel need to analyze all files in the project file, when the project file is relatively large, it takes a long time to obtain the analysis result, resulting in very low efficiency and thus blocking the development process; also, after each modification, all files in the project file need to be re - analyzed, resulting in a serious delay in feedback and affecting the development efficiency; moreover, manual analysis is prone to missing some content, making the analysis result inaccurate. It can be seen that this solution has problems such as low efficiency, inability to provide real - time feedback, and inability to ensure accuracy.

[0032] Based on the above research, in order to overcome the above problems, the present application provides a processing method for realizing automated analysis on demand. The method includes: for a target file existing in a project file of a target application, when the target file is a part of the project file (for example, the target file is any file existing in the project file), if an operation to open the target file is detected, first parse the target file to obtain an abstract syntax tree, so that the abstract syntax tree can describe the target file in a tree structure; then identify at least one component from the abstract syntax tree, so as to realize automatic component identification. It can be seen that the present application only analyzes (parses and identifies components) the currently opened file, greatly reducing the time overhead and resource overhead, thus effectively overcoming the defects caused by analyzing all files in the project file simultaneously (such as excessive resource overhead or excessive time overhead, etc.), which is beneficial to greatly reducing the memory occupancy and the load of the central processing unit (CPU), and further beneficial to improving the fluency to enhance the user experience.

[0033] In addition, the present application does not limit the execution entity of the above processing method. For example, the method can be applied to a terminal device or a server. For another example, the method can also be implemented by means of the data interaction process between the terminal device and the server. Among them, the terminal device can be a smart phone, a computer, a personal digital assistant (PDA), a tablet computer, etc. The server can be an independent server, a cluster server or a cloud server.

[0034] In order to enable those skilled in the art of the present technology to better understand the solution of the present application, the technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the accompanying drawings in the embodiments of the present application. Obviously, the described embodiments are only a part of the embodiments of the present application, rather than all the embodiments. Based on the embodiments of the present application, all other embodiments obtained by those of ordinary skill in the art without creative efforts shall fall within the protection scope of the present application.

[0035] To better understand the technical solution provided by the present application, the processing method provided by the present application will be described below with reference to some accompanying drawings first. As Figure 1 shown, the processing method provided by the embodiment of the present application includes S1-S2 below.

[0036] S1: For a target file existing in a project file of a target application, in response to an operation to open the target file, parse the target file to obtain an abstract syntax tree, where the target file is a part of the project file.

[0037] Among them, the target application refers to the application program that needs to perform component recognition processing; moreover, this application is not limited to the target application. For example, it can be implemented using any componentized front-end application.

[0038] In addition, the project file of the target application refers to various documents and resources generated during the development of the target application, so that the project file includes source code files, resource files, configuration files, etc., so that the target application can be implemented based on the project file. It can be seen that the project file of the target application can include multiple files. Among them, the source code file refers to the text file generated by actually writing a program, so that the source code file is used to describe the program logic and function implementation. The resource file is used to provide some resources (such as images, layouts, strings, etc.) for the target application. The configuration file is used to record some configurations of the target application (such as dependencies, plugins, and build options, etc.).

[0039] The target file refers to the file that exists and is opened in the project file of the target application; and the target file is a part of the project file. In addition, this application is not limited to the implementation manner of the target file. For example, the target file can refer to any file in the project file.

[0040] The above-mentioned "operation of opening the target file" requests to open the target file, so that the operation can trigger the opening process for the target file; moreover, this application is not limited to the operation. For example, it can be implemented using any operation that can open the target file (such as any operation that can use a code editor to open the target file).

[0041] The abstract syntax tree is used to describe the target file in a tree structure, and the abstract syntax tree includes multiple nodes. Among them, because different nodes are used to describe different syntax elements in the target file, so that the content blocks indicated by different nodes in the target file are different, so that the abstract syntax tree can describe the relationship between different content blocks in the target file.

[0042] In addition, this application is not limited to the acquisition method of the above-mentioned abstract syntax tree. For example, it can be implemented using any method that can convert a file into an AST, such as an editing tool (Babel).

[0043] It should be noted that Babel is a widely used dynamic programming language (JavaScript, JS) editing tool; moreover, Babel can be used to convert current JavaScript code into code compatible with legacy browsers or environments. Additionally, Babel includes a tokenizer, a parser, a traverser, a transformer, and a generator; the tokenizer is used to split the source code into an array of tokens; the parser is used to convert the array of tokens into an AST; the traverser is used to traverse the AST; the transformer is used to transform the AST (such as adding, deleting, or modifying nodes); the generator is used to generate the source code based on the AST. It can be seen that Babel can at least provide AST parsing and transformation functions, so that Babel can be applied to front-end development, so that subsequently, the source code in the target file can be parsed by Babel to obtain the AST, so that some other operations (such as code analysis, translation, optimization, etc.) can be performed based on the AST. In addition, Babel supports various plugins (such as supporting multiple programming languages), which can expand its functions.

[0044] Based on the above two paragraphs, in a possible implementation manner, the above S1 can specifically be: for the target file existing in the project file of the target application, in response to the operation of opening the target file, use the Parser in Babel to parse the target file to obtain an abstract syntax tree. Among them, because the Parser supports multiple programming languages such as modularization, JavaScript XML (JSX), TypeScript (TS), and TypeScript XML (TSX), so that the target file can be accurately and efficiently parsed with the help of the Parser. Also because the parsing process implemented by the Parser supports modular syntax (such as import and export) and supports compatibility analysis of multiple programming languages, so that information such as component definitions, function declarations, and class definitions can be obtained from the AST generated by the Parser subsequently, so that components (such as React components) can be more accurately identified in the subsequent traversal process.

[0045] S2: Identify at least one component from the abstract syntax tree.

[0046] It should be noted that the implementation manner of the above S2 is not limited in this application. For example, it can be implemented by means of a pre-set component identification rule. Another example is that it can be implemented by means of a machine learning model with component identification functions pre-constructed.

[0047] Based on the relevant content from S1 to S2 above, for the target file existing in the project file of the target application, when the target file is a part of the project file (such as any file existing in the project file), if an operation to open the target file is detected, then the target file is first parsed to obtain an abstract syntax tree, so that the abstract syntax tree can describe the target file in a tree structure; then, at least one component is identified from the abstract syntax tree, so that the at least one component can represent the components appearing in the target file. In this way, automatic component identification from the file can be achieved. It can be seen that this application only analyzes the currently opened file (such as parsing and component identification), greatly reducing the time and resource overheads. In this way, the defects caused by analyzing all files in the project file simultaneously (such as excessive resource overhead or excessive time overhead, etc.) can be effectively overcome, which is conducive to greatly reducing the memory occupancy and CPU load, and further conducive to improving the fluency to enhance the user experience.

[0048] In addition, in some scenarios, in order to better improve the user experience, any implementation manner of the processing method provided in this application is applied to a code editor, such as a source code editor (Visual Studio Code, VSCode), to achieve analyzing only the files opened in the code editor (such as parsing and component identification), thereby achieving on-demand analysis, and further being able to effectively avoid the defects caused by analyzing all files in the project file simultaneously.

[0049] It can be seen that in a possible implementation manner, for the target file existing in the project file of the target application, if it is detected that an operation to open the target file is triggered within the code editor, it can be determined that the target file may change. Therefore, the code editor will trigger a parsing process for the target file, so that the parsing process is used to parse the target file to obtain an abstract syntax tree; then, the code editor identifies at least one component from the abstract syntax tree, so that the at least one component can represent the components appearing in the target file. In this way, it is possible to achieve analyzing only the files that may change (such as parsing and component identification), without analyzing other files in the project file, so that other files do not occupy computing resources, which is conducive to better reducing the resource overhead.

[0050] Through research, it is found that for the above-mentioned project file, some files in the project file (such as, *.ts, *.tsx, *.js, *.jsx and other files) may have components, but other files in the project file except these files (such as, resource files, etc.) definitely do not have components. Therefore, in order to reduce the resource overhead, it is only necessary to parse and identify components for the files that may have components.

[0051] Based on the above research, in order to better reduce resource overhead, the present application provides a possible implementation manner of the processing method. In this manner, the processing method may at least include the following steps: in response to the type of the target file belonging to a preset file type set (such as the set {ts file, tsx file, js file, jsx file}), parse the target file to obtain an abstract syntax tree. The preset file type set is determined according to the types of files where components have appeared. In this way, it is possible to analyze only the files that may contain components, thereby effectively overcoming the resource waste caused by analyzing files that cannot contain components, and further facilitating better reduction of resource overhead.

[0052] It can be seen that in a possible implementation manner, for a target file existing in the project files of a target application, if it is detected that an operation to open the target file is triggered in the code editor, then determine whether the type of the target file belongs to the preset file type set. If it belongs, it can be determined that components may exist in the target file. Therefore, the target file can be parsed in the code editor to obtain an abstract syntax tree, and at least one component can be identified by the code editor from the abstract syntax tree. In this way, the resource waste caused by analyzing files that cannot contain components can be effectively overcome, thus facilitating better reduction of resource overhead.

[0053] It should be noted that for any file (such as the target file), the type of the file is determined according to the file extension (also known as the file suffix) of the file. For example, if the file name of the file satisfies the structural constraint of *.ts, it can be determined that the file extension of the file is ts, and thus it can be determined that the type of the target file is a ts file.

[0054] It should also be noted that for the above-mentioned preset file type set, the set refers to a pre-constructed set for recording the types of files that may contain components, so that the set can indicate which types of files may have components, and thus the set can indicate to a certain extent which types of files definitely do not have components. In addition, the preset file type set can be determined according to the types of files where components have appeared, so that the set can comprehensively indicate which types of files may have components. Furthermore, the present application does not limit the acquisition method of the preset file type set. For example, the preset file type set can be obtained by relevant personnel through manual annotation. Another example is that the preset file type set can be obtained by analyzing the project files of a large number of componentized application programs.

[0055] Based on the above four paragraphs, it can be seen that in some scenarios, for any file in the project files of the target application, if it is detected that an operation to open the file is triggered in the code editor, it is necessary to determine whether the file name of the file meets the structural constraints of *.ts, *.tsx, *.js, or *.jsx. If it does not meet the requirements, it can be determined that there will definitely be no components in the file, so there is no need to analyze the file (such as parsing and component recognition). However, if it meets the requirements, it can be determined that there may be components in the target file. Therefore, the target file can be parsed in the code editor to obtain an abstract syntax tree, and at least one component can be recognized from the abstract syntax tree by the code editor, which is beneficial to better reduce resource overhead.

[0056] It has been found through research that in some scenarios, such as scenarios with limited resources or scenarios where multiple files are opened in the code editor in a short period of time (or simultaneously), in order to better improve fluency, the file content can be loaded and parsed asynchronously, which can effectively overcome the lag caused by the need to load and parse a large amount of resources simultaneously, affecting the user experience.

[0057] Based on the above research, in order to better improve fluency, the present application provides a possible implementation manner of the processing method. In this manner, when the target file includes at least one file, the processing method may at least include the following steps: in response to an operation to open the target file, load the target file; in response to the completion of the loading of the target file, parse the target file to obtain an abstract syntax tree, which can realize the asynchronous loading and parsing of the file content, thereby effectively overcoming the lag caused by simultaneous loading and parsing, and further being beneficial to better improving the user experience.

[0058] It can be seen that in a possible implementation manner, for the target file (such as multiple files) existing in the project files of the target application, if it is detected that an operation to open the target file is triggered in the code editor, the target file is first loaded into the code editor, so that after it is determined that the target file has been successfully loaded into the code encoder, the code editor triggers a parsing process for the target file, so that the parsing process is used to parse the target file to obtain an abstract syntax tree; then, the code editor recognizes at least one component from the abstract syntax tree, which can realize the asynchronous loading and parsing of the file content in the code editor, thereby ensuring that the code editor will not cause lag due to an additional parsing process, and further being beneficial to improving fluency to better improve the user experience.

[0059] It has been found through research that in some scenarios, such as scenarios with limited resources, for large files, since the parsing of the large file requires a large amount of resources, some problems are likely to occur when parsing all the content at once, such as serious lag, crashes, and other problems.

[0060] Based on the above research, in order to overcome the above problems, the present application provides a possible implementation manner of the processing method. In this manner, the processing method may at least include the following steps: in response to the volume of the target file being greater than a preset volume threshold, parse each of the multiple content blocks divided from the target file to obtain the abstract syntax tree of each content block. The parsing processes of different content blocks occupy different time periods. In this way, it is possible to split and parse a large file, thereby effectively avoiding performance bottlenecks (such as severe lags, crashes, etc.) caused by parsing all content at once, and further facilitating better improvement of the user experience.

[0061] It can be seen that in a possible implementation manner, for a target file (such as a large file) existing in the project file of the target application, if it is detected that an operation to open the target file is triggered in the code editor, first, the code editor loads and parses the first content block in the target file to obtain the abstract syntax tree of the first content block, so that the abstract syntax tree of the first content block can describe the first content block according to the tree structure; then, the code editor loads and parses the second content block in the target file to obtain the abstract syntax tree of the second content block, so that the abstract syntax tree of the second content block can describe the second content block according to the tree structure;... (and so on); then, the code editor loads and parses the Nth content block (such as the last content block) in the target file to obtain the abstract syntax tree of the Nth content block, so that the abstract syntax tree of the Nth content block can describe the Nth content block according to the tree structure; finally, the code editor identifies at least one component from these abstract syntax trees. In this way, it is possible to effectively avoid performance bottlenecks (such as severe lags, crashes, etc.) caused by parsing all content at once. Here, N is a positive integer, and N represents the number of content blocks divided from the target file.

[0062] In addition, in a possible implementation, in order to further reduce resource overhead, for a target file (such as a large file) existing in the project file of the target application, if it is detected that an operation to open the target file is triggered in the code editor, the first content block in the target file is first loaded into the code editor, so that after determining that the first content block has been successfully loaded into the code encoder, the code editor parses the first content block to obtain the abstract syntax tree of the first content block; then the second content block in the target file is loaded into the code editor, so that after determining that the second content block has been successfully loaded into the code encoder, the code editor parses the second content block to obtain the abstract syntax tree of the second content block;... (and so on); then, the Nth content block in the target file is loaded into the code editor, so that after determining that the Nth content block has been successfully loaded into the code encoder, the code editor parses the Nth content block to obtain the abstract syntax tree of the Nth content block; finally, the code editor identifies at least one component from these abstract syntax trees, which is beneficial to better reducing resource pressure, thereby being able to better avoid performance bottlenecks (such as severe jamming, crashes, etc.) caused by processing all content at once.

[0063] It should be noted that the present application does not limit the acquisition method of the above-mentioned "multiple content blocks divided from the target file". For example, the multiple content blocks can be obtained by dividing the target file according to a pre-specified division rule. Another example is that in order to better improve the division flexibility, the acquisition process of the multiple content blocks can be: using a pre-constructed machine learning model with a file division function to process the target file to obtain the multiple content blocks, so that the same syntax element will not be divided into different content blocks, thereby being able to overcome the defects caused by fixed division positions, and further being beneficial to better improving the accuracy of component identification. Among them, the machine learning model is pre-trained based on some files (such as large files) and the pre-marked division positions for these files; or, the machine learning model is pre-trained based on some files and the pre-marked components for these files, so that the trained machine learning model can learn how to reasonably divide the file under the guidance of these marked components.

[0064] Through research, it is found that for any file, some content in the file (such as content for describing styles and content for describing the test process) is definitely not a component, and some content may be a component, so that some nodes in the AST obtained by parsing the file definitely do not belong to the component, and some nodes may belong to the component.

[0065] Based on the above research, in order to better improve efficiency, the present application provides a possible implementation manner of a processing method. In this manner, the processing method may at least include the following steps: For any node in the abstract syntax tree, in response to the type of the node belonging to a pre-defined node type set (such as the set {nodes corresponding to content for describing styles, nodes corresponding to content for describing the test process,...}), where this pre-defined node type set indicates the types of nodes that do not belong to components, delete the node from the abstract syntax tree so that there are no nodes in the abstract syntax tree after node deletion that definitely do not belong to components, so that at least one component can be identified from the abstract syntax tree after node deletion. In this way, it is possible to perform in-depth analysis on nodes in the AST that may belong to components, but perform simple analysis on nodes in the AST that definitely do not belong to components, which is beneficial to better improving performance (such as improving efficiency).

[0066] It can be seen that in a possible implementation manner, for the target file existing in the project file of the target application, after the code editor converts the target file into an AST in a certain way, delete the nodes in the AST that definitely do not belong to components (such as pruning), to obtain the AST after deletion, so that each node in the AST after deletion may belong to a component, so that component recognition can be performed based on the AST after deletion subsequently, which is beneficial to better improving efficiency.

[0067] It should be noted that for any node in the AST, the type of the node is determined based on the type (Type) field marked for the node, so that it can be determined whether the node may belong to a component based on the type of the node subsequently.

[0068] It should also be noted that the present application does not limit the acquisition method of the above pre-defined node type set. For example, the pre-defined node type set may be obtained by relevant personnel through manual marking. Another example is that the pre-defined node type set may be obtained by analyzing the ASTs of some files in the project files of a large number of componentized application programs.

[0069] Based on the above four paragraphs, for any file in the project file of the target application, after the code editor converts the file into an AST in a certain way, perform pruning processing on the AST according to the types of each node in the AST, so that each node in the AST after pruning can be recognized as a possible component node, so that component recognition can be performed on the AST after pruning subsequently. In this way, it is possible to effectively avoid resource waste caused by component recognition for nodes that definitely do not belong to components, which is beneficial to better improving performance.

[0070] It has been found through research that for functional components (including arrow functions), the components of the functional component satisfy the following constraints: the type of the node corresponding to the component is a syntax declaration for exporting a default module (Export Default Declaration), a function declaration (Function Declaration), a variable declaration (Variable Declaration), or an arrow function expression (Arrow Function Expression); and the return value of the node is a JSX element (also known as an interface element or a React element).

[0071] Based on the above research, in order to better improve the recognition effect, the present application provides a possible implementation manner of the processing method. In this manner, the processing method may at least include the following steps: for any node in the abstract syntax tree, in response to the type of the node being a syntax declaration for exporting a default module (Export Default Declaration), a function declaration (Function Declaration), a variable declaration (Variable Declaration), or an arrow function expression (Arrow Function Expression), obtain the analysis result of the return value of the node, so that the analysis result can indicate whether the type to which the return value belongs is an interface element (such as a JSX element), and the interface element is used to describe the application interface of the target application; in response to the analysis result indicating that the return value of the node belongs to an interface element, determine the above-mentioned at least one component based on the node, so that the at least one component includes the content indicated by the node in the target file (such as Figure 2 the content pointed to by the component in [[ ]]), and determine the component type of the foregoing "content indicated by the node in the target file" as a functional component, so that the functional component can be more accurately identified from the target file, thereby facilitating the improvement of the component recognition effect.

[0072] It can be seen that in a possible implementation, for the target file existing in the project file of the target application, after the code editor obtains the AST (such as the pruned AST above) based on the target file, the code editor determines some components (such as function components) by traversing the AST; and the determination process may specifically include: for any node in the AST, if the type of the node is Export Default Declaration, FunctionDeclaration, Variable Declaration, or Arrow Function Expression, it can be determined that the node may belong to a function component, so it can be further determined whether the return value of the node is a JSX element. If so, it can be determined that the content indicated by the node in the target file is a function component, so that subsequently, based on the foregoing "content indicated by the node in the target file", at least one component identified from the target file can be determined, so that the at least one component includes the foregoing "content indicated by the node in the target file", which is beneficial to improving the component recognition effect.

[0073] It should be noted that the present application does not limit the implementation manner of the step of "whether the return value is a JSX element". For example, for any node in the AST, the return statement in the node can be analyzed to obtain an analysis result, so that the analysis result can indicate whether the node can correctly render a JSX element. If so, it can be determined that the return value of the node is a JSX element; if not, it can be determined that the return value of the node is not a JSX element.

[0074] It should also be noted that JSX is a syntax extension of JavaScript used to describe the structure of user interfaces in React. JSX allows users to write code similar to Hyper Text Markup Language (HTML), and will be converted into React's createElement calls at the underlying layer and finally rendered as Document Object Model (DOM) elements.

[0075] It has been found through research that for a Higher-Order Component (HOC), the component of the higher-order component satisfies the following constraints: the type of the node corresponding to the component is Variable Declaration; and the node matches the name of the higher-order component (for example, the name field of the node is the name of the higher-order component, etc.). It should be noted that a higher-order component is a pattern in React, which is a function that receives a component and returns a new component; and HOC is used to encapsulate the common logic of components (such as data acquisition, event handling, etc.) to reduce duplicate code.

[0076] Based on the above research, in order to better improve the recognition effect, the present application provides a possible implementation manner of the processing method. In this manner, the processing method may at least include the following steps: for any node in the abstract syntax tree, in response to the type of the node being Variable Declaration, obtain the analysis result of the return value of the node, so that the analysis result can indicate whether the type to which the return value belongs is an interface element (such as a JSX element); in response to the analysis result indicating that the return value of the node does not belong to an interface element, obtain the matching result between the node and each name in at least one higher-order component name; in response to the matching result indicating that there is a name in the at least one higher-order component name that matches the node, determine the above-mentioned at least one component based on the node. The at least one component includes the content indicated by the node in the target file (such as Figure 2 the content pointed to by the component in), and determine the component type of the foregoing "content indicated by the node in the target file" as the higher-order component indicated by the name that matches the node, so that various higher-order components can be more accurately recognized from the target file.

[0077] It can be seen that in a possible implementation, for the target file existing in the project file of the target application, after the code editor obtains the AST (such as the pruned AST as described above) based on the target file, the code editor determines some components (such as various higher-order components) by traversing the AST; and this determination process may specifically include: for any node in the AST, if the type of the node is Variable Declaration, it can be determined that the node may be a function component or may be a certain higher-order component. Therefore, it can be further determined whether the return value of the node is a JSX element. If not, it can be determined that the node is definitely not a function component. Therefore, it can be determined whether the node matches each name in at least one higher-order component name. If it is determined that there is a name in the at least one higher-order component name that matches the node, it can be determined that the content indicated by the node in the target file is the higher-order component indicated by the aforementioned "name that matches the node", so that subsequently, based on the aforementioned "content indicated by the node in the target file", at least one component identified from the target file can be determined, so that the at least one component includes the aforementioned "content indicated by the node in the target file", which can help improve the component recognition effect.

[0078] It should be noted that the present application does not limit the acquisition method of the above-mentioned "at least one higher-order component name". For example, it can be specified manually by relevant personnel. Another example is that in order to better reduce costs, the "at least one higher-order component name" can be obtained by analyzing the associated materials (such as system documents, project files, user manuals, expert experience, etc.) of the target application using a pre-constructed machine learning model with the function of identifying HOC names, so that the "at least one higher-order component name" can comprehensively represent the HOC names that may appear in the project file of the target application. Among them, the associated materials are used to provide content related to the target application; and the present application does not limit the associated materials. In addition, the present application does not limit the construction method of the aforementioned machine learning model.

[0079] It has been found through research that for class components, the components of the class satisfy the following constraints: the type of the node corresponding to the component is Class Declaration; the node inherits from the abstract base class (React.Component) used to define class components; the return value of the render method in the node is a JSX element.

[0080] Based on the above research, in order to better improve the recognition effect, the present application provides a possible implementation manner of the processing method. In this manner, the processing method may at least include the following steps: For any node in the abstract syntax tree, in response to the type of the node being a class declaration, obtain the analysis result of the node; in response to the analysis result indicating that the node inherits the abstract base class (React.Component) for defining class components and the return value of the rendering method in the node belongs to an interface element (such as a JSX element), determine the above-mentioned at least one component based on the node. The at least one component includes the content indicated by the node in the target file, and determine the component type of the aforementioned "content indicated by the node in the target file" as a class component. The interface element is used to describe the application interface of the target application, so that it is possible to more accurately identify class components from the target file.

[0081] It can be seen that in a possible implementation manner, for the target file existing in the project file of the target application, after the code editor obtains the AST (such as the pruned AST as mentioned above) based on the target file, the code editor determines some components (such as class components) by traversing the AST; and the determination process may specifically include: For any node in the AST, if the type of the node is Class Declaration, it can be determined that the node may be a class component, so it can be judged whether the node inherits the abstract base class (React.Component) for defining class components. If so, further judge whether the return value of the rendering method in the node is a JSX element. If so, it can be determined that the content indicated by the node in the target file is a class component, so that subsequently, based on the aforementioned "content indicated by the node in the target file", at least one component identified from the target file can be determined, so that the at least one component includes the aforementioned "content indicated by the node in the target file", which is beneficial to improving the component recognition effect.

[0082] It has been found through research that in order to better improve the user experience, some interactive controls can be deployed around the identified components, so that users can subsequently use these controls to perform some processing on the components (such as end-to-end testing, etc.).

[0083] Based on the above research, in order to better improve the user experience, the present application provides a possible implementation manner of the processing method. In this manner, the processing method may at least include the following steps: For any component (such as Figure 2 the component shown), add the interactive control corresponding to the component to the target file according to the position of the component in the target file (such as by Figure 2the three buttons shown above the component in [document name], the distance between the position of the interactive control in the target file and the position of the component in the target file is less than a preset distance threshold, and the interactive control is used to trigger at least one process for the component, and the at least one process includes at least one test (such as the test implemented by the Figure 2 test code in [document name]), so that some executable operations of the component can be embedded above the component to improve development efficiency and operability, which is beneficial to better improve the user experience.

[0084] It should be noted that the implementation manner of the solution shown in the above paragraph is not limited in this application. For example, this solution can be implemented by means of the CodeLens function in VSCode. Among them, CodeLens is a function provided by VSCode, which is used to add interactive controls (such as buttons, information boxes, jump links, etc.) in the code editor, and the control can appear above or next to the code, so that users can trigger some operations (such as running tests, displaying references, displaying documents, etc.) by clicking the control.

[0085] It should also be noted that Figure 2 the "X" character that appears in [document name] is only used to indicate the content recorded in the file, so that the "X" has no other meaning.

[0086] It has been found through research that for a file being opened, the user may perform some editing operations on the file, such as deleting content, modifying content, adding content, etc., to cause the file to be updated, so that at least one component that has been recognized from the file before the update is very likely to not accurately describe the components that appear in the updated file.

[0087] Based on the above research, in order to better improve performance, this application provides a possible implementation manner of the processing method. In this manner, the processing method can at least include the following steps: in response to an editing operation (such as addition, deletion, modification, etc.) of the target file, update the target file according to the editing operation, and continue to execute the above step of "parsing the target file to obtain an abstract syntax tree" and its subsequent steps, so that it is possible to update the component recognition result as real-time as possible with the user's editing, which is beneficial to better improve the component recognition accuracy.

[0088] As can be seen, for the target file existing in the project file of the target application, if it is detected that an operation to open the target file is triggered within the code editor, the code editor triggers a parsing process for the target file, so that the parsing process is used to parse the target file to obtain an abstract syntax tree; then the code editor identifies at least one component from the abstract syntax tree, so that when an editing operation for the target file is detected, not only does the code editor update the target file according to the editing operation, so that the updated target file has changed as indicated by the editing operation compared to the target file before the update, but the code editor can also trigger the parsing process for the target file again, so that the parsing process is used to re-parse the target file to obtain an abstract syntax tree; then the code editor re-identifies at least one component from the abstract syntax tree,... (and so on). In this way, it is possible to update the component recognition result as real-time as possible with the user's editing when the file is in the open state, which is beneficial to better improving the accuracy of component recognition.

[0089] It has been found through research that for a file being opened, the user may edit some content in the file and will not edit all the content in the file. Therefore, in order to better save resources, it is possible to only analyze the edited content (such as parsing and component recognition), without re-analyzing all the content in the file.

[0090] Based on the above research, in order to better save resources, the present application provides a possible implementation manner of the processing method. In this manner, the processing method may at least include the following steps: in response to an editing operation of a target file, update the target file according to the editing operation; update the at least one component according to the change of the updated target file compared to the target file before the update, and the updated at least one component indicates the components existing in the updated target file. In this way, it is possible to update the component recognition result based on the edited content, which is beneficial to reducing resource overhead.

[0091] It can be seen that for the target file existing in the project file of the target application, if it is detected that an operation to open the target file is triggered within the code editor, the code editor triggers a parsing process for the target file, so that the parsing process is used to parse the target file to obtain an abstract syntax tree; then the code editor identifies at least one component from the abstract syntax tree, so that when an editing operation for the target file is detected, not only does the code editor update the target file according to the editing operation, so that the updated target file has changed as indicated by the editing operation compared with the target file before the update, but also the code editor can update at least one component according to the change, so that the updated at least one component can represent the components existing in the updated target file,... (and so on). In this way, it is possible to update the component recognition result as real-time as possible with the least possible resource overhead during user editing, which is conducive to better balancing the resource overhead and the component recognition accuracy.

[0092] It should be noted that the present application does not limit the implementation manner of the step of "updating the at least one component according to the change of the updated target file compared with the target file before the update". For example, when the change includes deleting the first content from the target file, adding the second content to the target file, and modifying the third content in the target file to the fourth content, this step can specifically be: if the first content belongs to a component, delete the first content from the at least one component; if the second content belongs to a component, add the second content to the at least one component; if the third content belongs to a component, delete the third content from the at least one component; if the fourth content belongs to a component, add the fourth content to the at least one component.

[0093] In addition, in some scenarios, such as scenarios where the positions of each component in the target file are concerned, in order to better improve performance, the above processing method may further include the following steps: after executing the step of "updating the at least one component according to the change of the updated target file compared with the target file before the update", determine the positions of the components in the updated at least one component in the target file according to the change, so that it is possible to adjust the position information of the components as real-time as possible with user editing, which is conducive to better improving the user experience.

[0094] It should be noted that the present application does not limit the process of determining the position shown in the upper paragraph. For example, specifically, for any one of the at least one updated component, if the component is a newly added component through the current editing operation (such as the second content or the fourth content above), the position of the component in the target file can be directly located in the target file; if the component is not a newly added component through the current editing operation, the position offset corresponding to the component can be determined first according to the "changes in the updated target file compared to the target file before the update"; then, according to the position offset, the position of the component in the target file obtained last time is offset to obtain the position of the component in the target file in the current time. In this way, the waste of resources caused by repositioning all components can be effectively overcome, which is beneficial to better reducing the resource overhead.

[0095] Based on the relevant content of the above processing method, it can be known that the present application provides a solution for positioning components in VScode based on AST parsing, and this solution has the characteristics shown in ①-⑨ below.

[0096] ① The above solution can analyze only the opened files (such as files that may change) through an incremental on-demand analysis method (such as AST parsing and component recognition), without analyzing all files in the project file at the same time. In this way, the defects caused by analyzing all files in the project file each time (such as large resource overhead) can be effectively overcome, which is beneficial to better improving the performance.

[0097] ② The above solution can unify the recognition process of various components (such as function components, class components, HOCs, etc.) into the same set of parsing logics (first analyze the type of the node and then analyze others), so that some tools and custom plugins can be used to adapt to various components later. In this way, the present application can accurately identify various components with the help of this parsing logic.

[0098] ③The file analysis timing and its performance optimization details of the above solution are as follows: To better improve the performance of VSCode and reduce resource consumption, this solution adopts an on-demand analysis method. That is, file analysis will only be performed when the user opens a file, rather than performing a global analysis on all files in the entire project file. This can effectively reduce resource overhead, improve the response speed of VSCode, and increase execution efficiency. Among them, this on-demand analysis means that whenever the user opens a file, VSCode will trigger the analysis process of this file, so that this analysis process can be used for AST parsing and component identification of this file. Through this on-demand analysis method, only the currently opened file will be analyzed, and other files will not consume resources, which is conducive to better saving resources. In addition, to better reduce resource pressure, this solution can adopt a delay strategy to further reduce resource overhead. This delay strategy means that when analyzing a file, VSCode will asynchronously load and parse the file content to ensure that VSCode will not freeze due to this analysis process. In addition, for large files, VSCode will perform batch analysis according to the actual situation (such as splitting large files into multiple parts for separate analysis) to avoid performance bottlenecks caused by analyzing all content at once. Moreover, to better save resources, this method adopts a local analysis strategy, hoping to save resources by adjusting the analysis depth of different parts of the file. This local analysis strategy means that when analyzing a file, VSCode only performs in-depth analysis on the code that may belong to components, while performing shallow analysis on other code (such as code blocks that are definitely not components, like style code and test code), which is conducive to further improving performance.

[0099] ④The file analysis details of the above solution are as follows: This solution can use Babel to analyze the file (such as AST parsing and component recognition) to identify the components in the file; moreover, this analysis process analyzes each part of the file based on the AST to determine whether each part meets the component constraints (such as whether the return value is a JSX element). In addition, this method can use the Babel's Parser to parse the file to make the parsing process support various syntax features such as modularization, JSX, and TypeScript, with the expectation of generating an AST through this parsing process, so that the structure of the file can be analyzed based on this AST later, and key component definitions, functions, expressions, etc. can be extracted. Among them, this parsing process includes support for the modular syntax of the file (such as import, export, etc. syntax) and compatibility analysis of various syntaxes such as JSX and TypeScript, so that VSCode can obtain information such as component definitions, function declarations, and class definitions through this AST, so that React components can be identified by traversing the AST later. This AST traversal refers to using the Babel's Traverser to traverse the AST, with the expectation of locating and identifying React components, JSX expressions, and other structures (such as HOC, conditional rendering, etc.) in the file. This AST traversal can not only ensure the syntax correctness of each code block, but also generate corresponding end-to-end test code as needed.In addition, the component type recognition process is as follows: for function components (including arrow functions), functions can be recognized by checking nodes such as Export Default Declaration, Function Declaration, and VariableDeclaration in the AST, and whether it is a React function component can be determined by judging whether the return value of the function is a JSX element. Similarly, arrow functions can be recognized by checking the Arrow Function Expression node in the AST, and whether it is a React function component can be determined by judging whether the return value of the function is a JSX element; for class components, class component recognition processing can be achieved through processes such as checking the Class Declaration node, identifying whether it inherits from React.Component, and analyzing whether the render method includes JSX elements, so that it will be recognized as a class component when the return value of the render method is determined to be a JSX element; for HOCs, HOC is a component pattern in React, and this solution supports the recognition processing of HOCs. Moreover, this solution can provide some HOC names (such as HOC names specified manually by users or HOC names obtained by analyzing a large number of documents) to VSCode in a dynamic configuration manner, so that VSCode can automatically recognize and parse these higher-order components. In addition, the HOC recognition process is based on the VariableDeclaration node, analyzing the wrapping logic of each higher-order component (such as React.forwardRef, withState, etc.), in order to ensure that VSCode can correctly handle various HOC wrapping forms in this way. Also, regarding the aforementioned "whether the return value is a JSX element", the key to component recognition is to judge whether the return value is a JSX element. Therefore, in order to implement this judgment, this solution can determine whether the code including the return statement correctly renders a JSX element by parsing the return statement. Only the code that can correctly render a JSX element will be recognized as a React component, so that it can be included in the scope of end-to-end test code generation subsequently.

[0100] ⑤ The above solution directly embeds some interactive buttons for executable operations into the upper part of the component through the CodeLens function in VSCode, so that users can trigger these operations through these buttons subsequently, which is conducive to improving efficiency.

[0101] ⑥ The above solution realizes parsing only the currently opened file through on-demand analysis and performance optimization, significantly reducing the analysis cost of irrelevant files (such as analysis time consumption and analysis resource overhead), thereby improving the response speed of the code editor and avoiding lags. It can be seen that this solution effectively reduces memory occupancy and CPU load through on-demand analysis, making project development (such as large project development) smoother, and thus can effectively overcome the performance problems caused by full-scale analysis of project files (such as in large project files, each full-scale analysis consumes a large amount of resources, etc.).

[0102] ⑦ The above solution realizes that according to the pre-configured HOC names, VSCode can dynamically identify and parse the HOCs in the file through the dynamic identification of HOCs. Even if the forms and implementation methods of these HOC components are diverse, VSCode can handle them automatically, thus realizing flexible support for higher-order components, and then being able to accurately identify the components wrapped by higher-order components. In this way, it can ensure that the generated test code is more accurate, avoid missing or incorrect component parsing, and improve code quality and test efficiency, thereby effectively overcoming the defects caused by the complex component hierarchy of components wrapped by HOCs (such as React.forwardRef) (such as the difficulty in identifying HOCs, the inability to effectively handle component relationships for HOCs, and the generation of correct test code, etc.).

[0103] ⑧ The above solution realizes directly providing interactive controls above each component through the CodeLens embedding interactive controls method, enabling users to use these controls to achieve operations such as generating end-to-end test code with one click and viewing relevant test suggestions, which is beneficial to improving development efficiency and further beneficial to enhancing the development experience. It can be seen that this solution ensures that users can conveniently view and operate components through the CodeLens function, reduces context switching, and improves the maintainability and operability of the code, thus effectively overcoming the defects caused by manually analyzing code and generating test code (such as users need to switch to other tools or command lines to execute these operations, affecting the user experience, etc.).

[0104] ⑨The above solution realizes AST parsing through Babel by accurately identifying components through AST analysis, so that various component forms (such as arrow functions, class components, HOCs, etc.) can be identified based on the AST subsequently, avoiding misjudgment and missed judgment, which is beneficial to improving the accuracy of component identification. In addition, this solution provides a unified component identification logic, enabling subsequent code analysis, reference relationship analysis, and test code generation to be implemented based on a relatively accurate component structure, thus facilitating the improvement of analysis accuracy and efficiency, and further helping to overcome the problem that different types of components (such as function components, class components, and arrow functions) cannot be accurately identified from complex code structures due to the diverse writing methods of React components.

[0105] Based on the processing method provided in the embodiments of the present application, the embodiments of the present application also provide a processing device, which will be explained and described below in conjunction with Figure 3 for explanation and illustration. Among them, Figure 3 is a schematic structural diagram of a processing device provided in the embodiments of the present application. It should be noted that for the technical details of the processing device provided in the embodiments of the present application, please refer to the relevant content of the above processing method.

[0106] As Figure 3 shown, the processing device 300 provided in the embodiments of the present application includes:

[0107] A parsing unit 301, configured to, for a target file existing in a project file of a target application, in response to an operation of opening the target file, parse the target file to obtain an abstract syntax tree, where the target file is a part of the project file;

[0108] An identification unit 302, configured to identify at least one component from the abstract syntax tree.

[0109] In a possible implementation manner, the parsing unit 301 is specifically configured to: in response to the type of the target file belonging to a preset file type set, parse the target file to obtain the abstract syntax tree, where the preset file type set is determined according to the types of files in which the component has appeared.

[0110] In a possible implementation manner, the parsing unit 301 is specifically configured to: in response to an operation of opening the target file, load the target file; in response to the completion of loading the target file, parse the target file to obtain the abstract syntax tree.

[0111] In a possible implementation manner, the parsing unit 301 is specifically configured to: in response to the volume of the target file being greater than a preset volume threshold, parse each of the multiple content blocks divided from the target file to obtain the abstract syntax tree of each content block, and the time periods occupied by the parsing processes of different content blocks are different.

[0112] In a possible implementation manner, the processing device 300 further includes: a deletion unit, configured to, before identifying at least one component from the abstract syntax tree, for any node in the abstract syntax tree, in response to the type of the node belonging to a pre-defined node type set, delete the node from the abstract syntax tree, where the pre-defined node type set indicates the types of nodes that do not belong to the component.

[0113] In a possible implementation manner, the identifying unit 302 is specifically configured to: for any node in the abstract syntax tree, in response to the type of the node being a syntax declaration for exporting a default module, a function declaration, a variable declaration, or an arrow function expression, obtain the analysis result of the return value of the node; in response to the analysis result indicating that the return value of the node belongs to an interface element, determine the at least one component according to the node, where the at least one component includes the content indicated by the node in the target file, and determine the component type of the content indicated by the node in the target file as a function component, and the interface element is used to describe the application interface of the target application.

[0114] In a possible implementation manner, the identifying unit 302 is specifically configured to: after obtaining the analysis result of the return value of the node, in response to the type of the node being the variable declaration and the analysis result indicating that the return value of the node does not belong to the interface element, obtain the matching result between the node and each name in at least one higher-order component name; in response to the matching result indicating that there is a name in the at least one higher-order component name that matches the node, determine the at least one component according to the node, where the at least one component includes the content indicated by the node in the target file, and determine the component type of the content indicated by the node in the target file as the higher-order component indicated by the name that matches the node.

[0115] In a possible implementation manner, the recognition unit 302 is specifically configured to: for any node in the abstract syntax tree, in response to the type of the node being a class declaration, obtain the analysis result of the node; in response to the analysis result indicating that the node inherits an abstract base class for defining class components and the return value of the rendering method in the node belongs to an interface element, determine the at least one component according to the node, the at least one component includes the content indicated by the node in the target file, and determine the component type of the content indicated by the node in the target file as a class component, and the interface element is used to describe the application interface of the target application.

[0116] In a possible implementation manner, the processing device 300 further includes: an adding unit, configured to, for any one of the components, add an interactive control corresponding to the component to the target file according to the position of the component in the target file, the distance between the position where the interactive control is located in the target file and the position where the component is located in the target file is less than a preset distance threshold, and the interactive control is used to trigger at least one process for the component, and the at least one process includes at least one test.

[0117] In a possible implementation manner, the processing device 300 further includes: a first updating unit, configured to, after recognizing at least one component from the abstract syntax tree, in response to an edit operation on the target file, update the target file according to the edit operation, and return the parsing unit 301 to continue to execute the step of parsing the target file to obtain an abstract syntax tree.

[0118] In a possible implementation manner, the processing device 300 further includes: a second updating unit, configured to, after recognizing at least one component from the abstract syntax tree, in response to an edit operation on the target file, update the target file according to the edit operation; update the at least one component according to the change of the updated target file relative to the target file before the update, and the updated at least one component indicates the components existing in the updated target file.

[0119] In a possible implementation manner, the processing device 300 is configured in a code editor.

[0120] Based on the relevant content of the above processing device 300, the working principle of the device 300 includes: for the target file existing in the project file of the target application, when the target file is a part of the project file (for example, the target file is any file existing in the project file), if an operation to open the target file is detected, the target file is first parsed to obtain an abstract syntax tree, so that the abstract syntax tree can describe the target file in a tree structure; then at least one component is identified from the abstract syntax tree, so that the at least one component can represent the components appearing in the target file, so that components can be automatically identified from the file. It can be seen that this application only analyzes the currently opened file (such as parsing and component identification), greatly reducing the time overhead and resource overhead, so that the defects caused by analyzing all files in the project file at the same time (such as excessive resource overhead or excessive time overhead, etc.) can be effectively overcome, which is beneficial to greatly reducing the memory occupancy and CPU load, and further beneficial to improving the fluency to improve the user experience.

[0121] In addition, an embodiment of the present application also provides an electronic device, the device includes a processor and a memory: the memory is used to store instructions or computer programs; the processor is used to execute the instructions or computer programs in the memory, so that the electronic device executes any implementation manner of the processing method provided by the embodiment of the present application.

[0122] See Figure 4 , which shows a schematic structural diagram of an electronic device 400 suitable for implementing the embodiments of the present disclosure. The terminal device in the embodiments of the present disclosure may include, but is not limited to, mobile terminals such as mobile phones, laptop computers, digital broadcast receivers, PDAs (Personal Digital Assistants), PADs (Tablet Computers), PMPs (Portable Multimedia Players), in-vehicle terminals (such as in-vehicle navigation terminals), etc., and fixed terminals such as digital TVs, desktop computers, etc. Figure 4 The electronic device shown is only an example and should not bring any limitation to the functions and usage scope of the embodiments of the present disclosure.

[0123] As Figure 4 shown, the electronic device 400 may include a processing device (such as a central processing unit, a graphics processing unit, etc.) 401, which may perform various appropriate actions and processes according to the program stored in the read-only memory (ROM) 402 or the program loaded from the storage device 408 into the random access memory (RAM) 403. In the RAM 403, various programs and data required for the operation of the electronic device 400 are also stored. The processing device 401, the ROM 402, and the RAM 403 are connected to each other through a bus 404. The input / output (I / O) interface 405 is also connected to the bus 404.

[0124] Typically, the following devices can be connected to the I / O interface 405: input devices 406 including, for example, a touch screen, a touchpad, a keyboard, a mouse, a camera, a microphone, an accelerometer, a gyroscope, etc.; output devices 407 including, for example, a liquid crystal display (LCD), a speaker, a vibrator, etc.; storage devices 408 including, for example, magnetic tapes, hard disks, etc.; and a communication device 409. The communication device 409 can allow the electronic device 400 to communicate with other devices wirelessly or wiredly to exchange data. Although Figure 4 the electronic device 400 with various devices is shown, it should be understood that it is not required to implement or have all the shown devices. Instead, more or fewer devices can be implemented or had.

[0125] In particular, according to an embodiment of the present disclosure, the processes described above with reference to the flowcharts can be implemented as computer software programs. For example, an embodiment of the present disclosure includes a computer program product, which includes a computer program carried on a non-transitory computer-readable medium, and the computer program contains program codes for executing the methods shown in the flowcharts. In such an embodiment, the computer program can be downloaded and installed from a network through the communication device 409, or installed from the storage device 408, or installed from the ROM 402. When the computer program is executed by the processing device 401, the above functions defined in the method of the embodiment of the present disclosure are executed.

[0126] The electronic device provided by the embodiment of the present disclosure and the method provided by the above embodiment belong to the same inventive concept. Technical details not described in detail in this embodiment can be referred to the above embodiment, and this embodiment has the same beneficial effects as the above embodiment.

[0127] An embodiment of the present application also provides a computer-readable medium, in which instructions or a computer program are stored, and when the instructions or the computer program run on a device, the device is caused to execute any implementation manner of the processing method provided by the embodiment of the present application.

[0128] It should be noted that the above-mentioned computer-readable medium in the present disclosure can be a computer-readable signal medium, a computer-readable storage medium, or any combination of the two. The computer-readable storage medium can be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the above. More specific examples of the computer-readable storage medium can include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, 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 disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present disclosure, the computer-readable storage medium can be any tangible medium that contains or stores a program, and this program can be used by or in conjunction with an instruction execution system, apparatus, or device. In the present disclosure, the computer-readable signal medium can include a data signal propagated in a baseband or as part of a carrier wave, which carries computer-readable program code. Such a propagated data signal can take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above. The computer-readable signal medium can also be any computer-readable medium other than the computer-readable storage medium, and this computer-readable signal medium can send, propagate, or transmit a program for use by or in conjunction with an instruction execution system, apparatus, or device. The program code contained on the computer-readable medium can be transmitted by any appropriate medium, including but not limited to: wires, optical cables, RF (radio frequency), etc., or any suitable combination of the above.

[0129] In some embodiments, the client and the server can communicate using any currently known or future-developed network protocol such as HTTP (Hyper Text Transfer Protocol), and can be interconnected with digital data communication in any form or medium (e.g., a communication network). Examples of the communication network include a local area network (“LAN”), a wide area network (“WAN”), the Internet (e.g., the Internet), and a peer-to-peer network (e.g., an ad hoc peer-to-peer network), as well as any currently known or future-developed network.

[0130] The above-mentioned computer-readable medium can be included in the above-mentioned electronic device; or it can exist separately and not be assembled into the electronic device.

[0131] The above-mentioned computer-readable medium carries one or more programs, and when the above-mentioned one or more programs are executed by the electronic device, the electronic device can execute the above-mentioned method.

[0132] Computer program code for performing the operations of this disclosure may be written in one or more programming languages or combinations thereof. The foregoing programming languages include, but are not limited to, object-oriented programming languages such as Java, Smalltalk, C++, and also include conventional procedural programming languages such as the "C" language or similar programming languages. The program code may execute entirely on the user's computer, partly on the user's computer, as a stand-alone software package, partly on the user's computer and partly on a remote computer, or entirely on the remote computer or server. In the case of a remote computer, the remote computer may be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or alternatively, may be connected to an external computer (e.g., through the Internet using an Internet service provider).

[0133] The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of systems, methods, and computer program products according to various embodiments of the present disclosure. In this regard, each block in the flowchart or block diagram may represent a module, a segment of a program, or a portion of code that contains one or more executable instructions for implementing a specified logical function. It should also be noted that, in some alternative implementations, the functions noted in the blocks may occur in a different order than noted in the drawings. For example, two consecutive blocks shown may actually be executed substantially in parallel, or they may sometimes be executed in the reverse order, depending on the functions involved. It should also be noted that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, can be implemented by a dedicated hardware-based system that performs the specified functions or operations, or can be implemented by a combination of dedicated hardware and computer instructions.

[0134] The units described in the embodiments of the present disclosure may be implemented in software or in hardware. Among them, the name of the unit / module does not, in some cases, constitute a limitation on the unit itself.

[0135] The functions described above herein may be performed, at least in part, by one or more hardware logic components. By way of example, and without limitation, exemplary types of hardware logic components that may be used include: field programmable gate arrays (FPGA), application specific integrated circuits (ASIC), application specific standard products (ASSP), system on a chip (SOC), complex programmable logic devices (CPLD), and the like.

[0136] In the context of the present disclosure, a machine-readable medium can 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 can be a machine-readable signal medium or a machine-readable storage medium. The machine-readable medium can include, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, apparatus, or devices, or any suitable combination of the foregoing. More specific examples of the machine-readable storage medium would include electrical connections based on one or more wires, portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fibers, portable compact disk read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination of the foregoing.

[0137] It should be noted that the various embodiments in this specification are described in a progressive manner, and the key point of each embodiment is to illustrate the differences from other embodiments. The same or similar parts among the various embodiments can be referred to each other. For the systems or apparatuses disclosed in the embodiments, since they correspond to the methods disclosed in the embodiments, the descriptions are relatively simple, and the relevant parts can be referred to the descriptions in the method section.

[0138] It should be understood that in this application, "at least one (item)" means one or more, and "a plurality" means two or more. "And / or" is used to describe the association relationship of associated objects and indicates that three relationships can exist. For example, "A and / or B" can mean: only A exists, only B exists, and both A and B exist simultaneously. Among them, A and B can be singular or plural. The character " / " generally indicates that the associated objects before and after are in an "or" relationship. "At least one (one) of the following" or similar expressions refer to any combination of these items, including any combination of single items (ones) or plural items (ones). For example, at least one (one) of a, b, or c can mean: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", where a, b, c can be single or multiple.

[0139] It should also be noted that in this text, relational terms such as first and second are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any actual relationship or order between these entities or operations. Moreover, the term "comprising", "including" or any other variant thereof is intended to cover non-exclusive inclusion, so that a process, method, article or device comprising a series of elements not only includes those elements, but also includes other elements not expressly listed, or also includes elements inherent to such process, method, article or device. Without further limitation, an element defined by the statement "comprising a..." does not exclude the presence of additional identical elements in the process, method, article or device comprising said element.

[0140] The steps of the methods or algorithms described in connection with the embodiments disclosed herein may be implemented directly in hardware, in software modules executed by a processor, or in a combination thereof. The software modules may be placed in random access memory (RAM), internal memory, read-only memory (ROM), electrically programmable ROM, electrically erasable programmable ROM, registers, hard disk, removable disk, CD-ROM, or any other form of storage medium known in the art.

[0141] The foregoing description of the disclosed embodiments enables those skilled in the art to implement or use the present application. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of the present application. Thus, the present application is not intended to be limited to the embodiments shown herein, but is to be accorded the widest scope consistent with the principles and novel features disclosed herein.

Claims

1. A processing method, characterized in that, The method includes: For a target file existing in a project file of a target application, in response to an operation of opening the target file, parsing the target file to obtain an abstract syntax tree, where the target file is a part of the project file; Identifying at least one component from the abstract syntax tree.

2. The method according to claim 1, wherein The parsing the target file to obtain an abstract syntax tree includes: In response to the type of the target file belonging to a preset file type set, parsing the target file to obtain the abstract syntax tree, where the preset file type set is determined according to the types of files in which the component has appeared.

3. The method according to claim 1, characterized in that, The in response to the operation of opening the target file, parsing the target file to obtain an abstract syntax tree includes: In response to the operation of opening the target file, loading the target file; In response to the completion of loading the target file, parsing the target file to obtain the abstract syntax tree.

4. The method according to claim 1, wherein The parsing the target file to obtain an abstract syntax tree includes: In response to the volume of the target file being greater than a preset volume threshold, respectively parsing multiple content blocks divided from the target file to obtain the abstract syntax trees of the respective content blocks, and the parsing processes of different content blocks occupy different time periods.

5. The method according to claim 1, wherein Before the identifying at least one component from the abstract syntax tree, the method further includes: For any node in the abstract syntax tree, in response to the type of the node belonging to a pre - defined node type set, deleting the node from the abstract syntax tree, where the pre - defined node type set indicates the types of nodes that do not belong to the component.

6. The method according to claim 1, characterized in that, The identifying at least one component from the abstract syntax tree includes: For any node in the abstract syntax tree, in response to the type of the node being a syntax declaration for exporting a default module, a function declaration, a variable declaration, or an arrow function expression, obtaining an analysis result of the return value of the node; In response to the analysis result indicating that the return value of the node belongs to an interface element, determining the at least one component based on the node, where the at least one component includes the content indicated by the node in the target file, and determining the component type of the content indicated by the node in the target file as a function component, and the interface element is used to describe the application interface of the target application.

7. The method according to claim 6, wherein After the obtaining the analysis result of the return value of the node, the method further includes: In response to the type of the node being the variable declaration and the analysis result indicating that the return value of the node does not belong to an interface element, obtaining a matching result between the node and each name in at least one high - order component name; In response to the matching result indicating that there is a name in the at least one high - order component name that matches the node, determining the at least one component based on the node, where the at least one component includes the content indicated by the node in the target file, and determining the component type of the content indicated by the node in the target file as the high - order component indicated by the name that matches the node.

8. The method according to claim 1, wherein The identifying at least one component from the abstract syntax tree includes: For any node in the abstract syntax tree, in response to the type of the node being a class declaration, obtain the analysis result of the node; In response to the analysis result indicating that the node inherits an abstract base class for defining class components and that the return value of the rendering method in the node belongs to an interface element, determine the at least one component based on the node, the at least one component including the content indicated by the node in the target file and determining the component type of the content indicated by the node in the target file as a class component, the interface element being used to describe the application interface of the target application.

9. The method according to claim 1, wherein The method further includes: For any one of the components, according to the position of the component in the target file, add an interactive control corresponding to the component to the target file, the distance between the position of the interactive control in the target file and the position of the component in the target file being less than a preset distance threshold, the interactive control being used to trigger at least one process for the component, the at least one process including at least one test.

10. The method according to claim 1, characterized in that, After identifying at least one component from the abstract syntax tree, the method further includes: In response to an edit operation on the target file, update the target file according to the edit operation and continue to execute the step of parsing the target file to obtain an abstract syntax tree.

11. The method according to claim 1, characterized in that, After identifying at least one component from the abstract syntax tree, the method further includes: In response to an edit operation on the target file, update the target file according to the edit operation; According to the changes that the updated target file has compared to the target file before the update, update the at least one component, and the updated at least one component indicates the components existing in the updated target file.

12. The method according to any one of claims 1-11, characterized in that, The method is applied to a code editor.

13. A processing device, characterized in that, It includes: A parsing unit, configured to, for a target file existing in a project file of a target application, in response to an operation of opening the target file, parse the target file to obtain an abstract syntax tree, the target file being a part of the project file; An identifying unit, configured to identify at least one component from the abstract syntax tree.

14. An electronic device, characterized in that, The device includes: a processor and a memory; The memory is configured to store instructions or computer programs; The processor is configured to execute the instructions or computer programs in the memory so that the electronic device executes the method according to any one of claims 1-12.

15. A computer-readable medium, characterized in that, Instructions or computer programs are stored in the computer-readable medium, and when the instructions or computer programs run on a device, the device executes the method according to any one of claims 1-12.

16. A computer program product, characterized in that, It includes a computer program carried on a non-transitory computer-readable medium, the computer program including program code for executing the method according to any one of claims 1-12.

Images