-
Notifications
You must be signed in to change notification settings - Fork 55
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
Extend safeHref #58
base: master
Are you sure you want to change the base?
Extend safeHref #58
Conversation
…ls to be added, and to overwrite and allow protocol from component
|
||
const Box: BoxComponent = ({ is = 'div', innerRef, children, allowUnsafeHref, ...props }) => { | ||
const Box: BoxComponent = ({ is = 'div', innerRef, children, allowUnsafeHref, allowProtocols, ...props }) => { |
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.
Need to add these to the PropTypes as well ( allowUnsafeHref
and allowProtocols
)
Co-Authored-By: Matt Shwery <[email protected]>
Co-Authored-By: Matt Shwery <[email protected]>
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.
Just some thoughts! Overall LGTM. :)
@@ -22,7 +22,16 @@ const Box: BoxComponent = ({ is = 'div', innerRef, children, allowUnsafeHref, .. | |||
*/ | |||
const safeHrefEnabled = (typeof allowUnsafeHref === 'boolean' ? !allowUnsafeHref : getUseSafeHref()) && is === 'a' && parsedProps.href | |||
if (safeHrefEnabled) { | |||
const {safeHref, safeRel} = extractAnchorProps(parsedProps.href, parsedProps.rel) | |||
const hrefData:HrefData = { |
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.
Nit: What's the motivation for explicitly marking the type here? What happens if you remove :HrefData
?
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.
If we opt to keep this as-is, I would suggest a space between hrefData:
and HrefData
.
/** | ||
* - Find protocol of URL or set to 'relative' | ||
* - Find origin of URL | ||
* - Determine if sameOrigin | ||
* - Determine if protocol of URL is safe | ||
*/ | ||
const protocolResult = url.match(PROTOCOL_REGEX) | ||
const originResult = url.match(ORIGIN_REGEX) | ||
const cleanedUrl = url.trim() |
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.
Might we worth putting a comment motivating why this is a sufficient "cleanup" step? For instance a link to:
https://html.spec.whatwg.org/multipage/links.html#links-created-by-a-and-area-elements
I can confirm that this is a sufficient cleanup, at least in Node:
> ["\u0009", "\u000A", "\u000C", "\u000D", "\u0020"].map(s => s.trim())
[ '', '', '', '', '' ]
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.
You could also use url.parse
(https://nodejs.org/api/url.html#url_url_parse_urlstring_parsequerystring_slashesdenotehost) and then grab the pieces that you need.
An update to the safeHref functionality to better support our users
data:
protocol from safe protocols to further protect usersconfigureSafeHref
methodallowProtocols
safeHref