-
Notifications
You must be signed in to change notification settings - Fork 3.9k
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
Refactor: move getRealChildNodes and getRealChildren to core #34813
Conversation
Hey @jridgewell! These files were changed:
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good! Related tests should join test-query.js
instead of test-dom.js
, but otherwise approving to unblock
const nodes = element.getRealChildNodes | ||
? element.getRealChildNodes() | ||
: toArray(element.childNodes); | ||
const nodes = realChildNodes(element); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Would this change handle a basic Element
less efficiently since it's not using the built-in iterator here?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thats a good question! I don't know why the underlying realChildNodes
isn't directly using element.childNodes
, since it seems to be attempting to do the same thing. @jridgewell do you know?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It looks like this is checking whether getRealNodes
is defined, ie "Is this a CustomElement? If so, use our helper to get the real children, otherwise it's an ordinary element and we should use its children because they're all "real""
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Definitely what it is doing. My question is: "why does childNodes
exist as a helper".
Lines 250 to 265 in c88b275
/** | |
* Finds all child nodes that satisfy the callback. | |
* These nodes can include Text, Comment and other child nodes. | |
* @param {!Node} parent | |
* @param {function(!Node):boolean} callback | |
* @return {!Array<!Node>} | |
*/ | |
export function childNodes(parent, callback) { | |
const nodes = []; | |
for (let child = parent.firstChild; child; child = child.nextSibling) { | |
if (callback(child)) { | |
nodes.push(child); | |
} | |
} | |
return nodes; | |
} |
Can we replace it with toArray(node.childNodes).filter(callback)
Or iterate through el.childNodes
directly
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
From further investigation, this is only used in two places. Will remove it entirely in a followup PR.
node.hasAttribute('overflow')) | ||
) { | ||
return true; | ||
if (node.nodeType !== Node.ELEMENT_NODE) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
…ebook-like-bento-version * 'main' of github.com:ampproject/amphtml: (23 commits) `amp-story-desktop-one-panel` Update demo with usecases (ampproject#34867) 🚮 Remove src/purifier.js rollup config (ampproject#34876) Validator Rollup (ampproject#34769) ✨ `amp-story-desktop-one-panel` Check UI type to get page dimension on tap (ampproject#34875) Refactor: move getRealChildNodes and getRealChildren to core (ampproject#34813) 🏗📖 Fix some example files that do not validate (ampproject#34835) 🏗Add `#test` and `#testing` to alias list (ampproject#34853) Add css files for missing components (ampproject#34861) Apply bulk transform to html tags (ampproject#34836) 🐛 amp-ima-video: Fix duration label on livestreams (ampproject#34865) ♻️ Extract `applyFillContent` into a standalone function (ampproject#34858) Give script tag closing tag (ampproject#34832) 🏗 Refinements to renovate config (ampproject#34862) Bento: Enable `SocialShare` for npm publishing (ampproject#34817) 🏗 Use aliased paths in generated extensions (ampproject#34860) ✨ `amp-story-desktop-one-panel` Position distance="2" page below viewport (ampproject#34834) 🏗 Set `wrapper` on generated Bento extensions (ampproject#34843) 🧪[story-ads] Allow viewer to set progress bar segment experiment. (ampproject#34827) 🏗 Allow extension bundles to specify their own wrapper (ampproject#34845) 🏗🚀 Speed up validated example grouping ~45x (ampproject#34837) ...
summary
In order to remove Runtime dependencies from
amp-layout
'sbuildCallback
, I've extracted getRealChildNodes and getRealChildren to core from CE and BE.The primary diff in most files looks like this:
Note: I've noticed that in the transition from classic to bento, we are making lots of small tradeoffs that reduce our reliance on runtime code (v0.js) and will end up duplicated in all of the extensions. It is definitely a worthwhile tradeoff, but at some point far in the future may be worth mitigating.