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

Forms won't submit when form ID contains a slash #46

Closed
foobear opened this Issue Jan 5, 2018 · 7 comments

Comments

Projects
None yet
3 participants
@foobear
Contributor

foobear commented Jan 5, 2018

Unpoly will not submit <form> tags with an id attribute that contains a slash.

The request is never made, and there is no error message in the browser console.
Enabling Unpoly logging also does not print any information.

Examples:

I'd expect Unpoly to behave as it would without any slashes inside the ID.
If that is not possible, an error should be thrown.

@OvermindDL1

This comment has been minimized.

OvermindDL1 commented Jan 5, 2018

That might be because / is invalid in HTML4 and earlier (although the restriction was lifted in HTML5 I just found out). Initially (and if you want to be sure it works in all browsers) the HTML id attribute is restricted to the set of [a-zA-Z0-9_-]

Using / would be especially problematic as it could prevent an id from being referenced from HTML as well as it could be inferred as a URL path instead of a DOM id depending on implementation.

@triskweline

This comment has been minimized.

Contributor

triskweline commented Jan 7, 2018

I'm assuming submitting such a form would trigger a replacement for form#test/test, which is an invalid CSS selector.

@foobear What's your use case for using slashes in IDs?

@foobear

This comment has been minimized.

Contributor

foobear commented Jan 8, 2018

Good point. While form#test/test is an invalid CSS selector, the form ID would still be valid HTML5.

Maybe Unpoly could transform its "default" selector generated by the form ID to something that works, like form[id="test/test"]. However, I am not sure if this could cover all cases and if Unpoly would need to do it.
Throwing an error would be fine for me. Since jQuery or document.querySelector cause an error, I'd have expected to see one, too.

The slashes in IDs already existed in the application "because of reasons". In this case I could change the application to not use slashes in IDs.

@triskweline

This comment has been minimized.

Contributor

triskweline commented Jan 8, 2018

I've seen one other case where slashes where used (inlining templates in AngularJS).

If it is valid HTML5 we should make some effort to support it with the [id="test/test"] approach.

I believe this could be a small change here:

selectorForElement = (element) ->

describe 'up.util.selectorForElement', ->

@OvermindDL1

This comment has been minimized.

OvermindDL1 commented Jan 8, 2018

If it is valid HTML5 we should make some effort to support it with the [id="test/test"] approach.

Maybe only do that if it is an invalid #... selector as I think doing it that way is slightly slower? The regex I gave above should be able to detect it fine as that was the old HTML4 standard.

@triskweline

This comment has been minimized.

Contributor

triskweline commented Jan 8, 2018

Yeah, definitely only when there's a weird character in the ID.

@triskweline

This comment has been minimized.

Contributor

triskweline commented Feb 13, 2018

Will be fixed in the next release.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment