Skip to content
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

lowerCaseAttributeNames: false, doesn't do his job. attributes are still lower case chars only. #168

Closed
jerome-diver opened this issue Jul 26, 2020 · 9 comments

Comments

@jerome-diver
Copy link

jerome-diver commented Jul 26, 2020

Expected Behavior

textarea attribute name: "defaultValue" should stay upper case, but instead, become lower case chars: "defaultvalue".
i do use htmlparser2 option key to define related options to get this to work, but it still failed.

Actual Behavior

defaultValue become defaultvalue (lower case char "v") even with htmlparser2 options setup (see below).

Steps to Reproduce

use a html template with node elements with attributes name contain upper case chars, parse them, use htmlparse2 option to try to remove lowerCaseAttributeNames, and look at the result... still lower case attribute names.

Reproducible Demo

textarea(type='text' id='message' name='message'
                        rows="4" cols="50" defaultValue="")

(pug template fetched to a react client, then console.log show the template rendered text has still upper case chars attribute names)

parse(this.state.content, 
            { htmlparser2: {
                xmlMode: true,
                lowerCaseAttributeNames: false,
                lowerCaseTags: false
              } 
            } )

Environment

  • Version:
    0.13.0
  • Platform:
    archlinux
  • Browser:
    firefox-78.0.2
@remarkablemark
Copy link
Owner

Thanks for opening this issue @jerome-diver. Can you help me reproduce this issue on Repl.it, JSFiddle, or CodeSandbox?

@jerome-diver
Copy link
Author

No i can not. But you have all the elements requested to reproduce the problem. Just parse a html string contained upper case attributes name and you will see.

@lazerwalker
Copy link

lazerwalker commented Sep 26, 2020

@remarkablemark I'm experiencing this too. Here's a fairly trivial test case: https://repl.it/repls/FriendlyYearlyPublisher#index.js. I believe this is running Node, but I'm experiencing this in the browser as well.

My expectation is that type in the returned object would be MyCustomUppercaseComponent, not mycustomuppercasecomponent. Is that a correct understanding of the lowerCaseTags flag?

Thanks!

@remarkablemark
Copy link
Owner

remarkablemark commented Sep 26, 2020

@lazerwalker What version of html-react-parser are you using? I see in your Repl.it that you're using 0.10.1.

This feature was made available in 0.12.0. Also, this only works server-side (Node.js) and does not work client-side (browser).

See Repl.it of your example working.

@lazerwalker
Copy link

aha, sorry about that — I just clicked the Repl.it link you posted above and used whatever it gave me. But it'll be failing for me locally since I'm doing it in the browser.

The README doesn't specify that this feature doesn't work in the browser. I'm happy to submit a PR to update it, but just wanted to confirm: is it specifically this flag that isn't supported, or changing any htmlparser2 settings?

@remarkablemark
Copy link
Owner

remarkablemark commented Sep 26, 2020

@lazerwalker Yes a PR to explicitly state that this feature is available in >=0.12.0 and only works on the server (Node.js) and not the client (browser) would be greatly appreciated.

Making this feature work in the browser may take some effort since in html-dom-parser, htmlparser2 is only available on Node.js and it's intentionally not included in the browser bundle due to its large size.

@danielsnider
Copy link

This is an issue for me too. Anyone have a work-around?

@lazerwalker
Copy link

I personally did not manage to find a browser (rather than Node) solution, but I have not looked at this in a year.

@h0jeZvgoxFepBQ2C
Copy link

I'm also looking for a solution for this problem, our app is running in the browser...? Actually this issue should be reopened @remarkablemark ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants