Skip to content

refactor(schematics): use parse5 for finding inputs and outputs #12524

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged

Conversation

devversion
Copy link
Member

@devversion devversion commented Aug 4, 2018

  • No longer constructs a complex and unreadable RegExp for finding Angular inputs and outputs. Since we declared parse5 as a dependency for the schematics, we could use parse5.
  • Adds types for parse5 as dev dependency since parse5 is often used in the schematics.

Note: Adding tests for all those things when walking through all rules and updating them.

@devversion devversion added pr: merge safe target: major This PR is targeted for the next major release labels Aug 4, 2018
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Aug 4, 2018
import {findAttributeInElementWithAttrs, findAttributeInElementWithTag} from './elements';

/** Finds the specified Angular @Input in the given elements with tag name. */
export function findInputsInElementWithTag(html: string, name: string, tagNames: string[]) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

name -> inputName?
(similar for other functions)

import {findAttributeInElementWithAttrs, findAttributeInElementWithTag} from './elements';

/** Finds the specified Angular @Input in the given elements with tag name. */
export function findInputsInElementWithTag(html: string, name: string, tagNames: string[]) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would change the all of the function names from InElement to OnElement

}

/** Finds the specified Angular @Output in elements that have one of the specified attributes. */
export function findAllOutputsInElWithAttr(html: string, name: string, attrs: string[]) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should have element written out to be consistent with all the other functions (even if it makes the line wrap 😉)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah I actually forgot about that function at all. Should be findOutputsOnElementWithAttr.

import {DefaultTreeDocument, DefaultTreeElement, parseFragment} from 'parse5';

/**
* Parses a HTML fragment and travers all AST nodes in order find elements that include the
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

traverse

@devversion devversion force-pushed the refactor/schematics-html-parse5 branch from c983971 to 1c141e9 Compare August 8, 2018 14:21
@devversion
Copy link
Member Author

@jelbourn Addressed your feedback. Thanks

* Parses a HTML fragment and traverses all AST nodes in order find elements that
* include the specified attribute.
*/
export function findElementWithAttribute(html: string, attributeName: string) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This one is still InElement instead of OnElement

Copy link
Member Author

@devversion devversion Aug 8, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I guess you mean that this should be Elements and the functions below should use OnElement instead of InElement. I've made those changes.

* No longer constructs a complex and unreadable RegExp for finding Angular inputs and outputs. Since we declared `parse5` as a dependency for the schematics, we could use `parse5`.
* Adds types for parse5 as dev dependency since parse5 is often used in the schematics.
@devversion devversion force-pushed the refactor/schematics-html-parse5 branch from 1c141e9 to 8e9c7e0 Compare August 8, 2018 18:58
Copy link
Member

@jelbourn jelbourn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@jelbourn jelbourn added pr: lgtm action: merge The PR is ready for merge by the caretaker labels Aug 8, 2018
@ngbot
Copy link

ngbot bot commented Aug 8, 2018

I see that you just added the pr: merge ready label, but the following checks are still failing:
    failure status "continuous-integration/travis-ci/pr" is failing

If you want your PR to be merged, it has to pass all the CI checks.

If you can't get the PR to a green state due to flakes or broken master, please try rebasing to master and/or restarting the CI job. If that fails and you believe that the issue is not due to your change, please contact the caretaker and ask for help.

@josephperrott josephperrott merged commit 1effb16 into angular:master Aug 9, 2018
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement target: major This PR is targeted for the next major release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants