Add support for pretty-printing HTMLElements #47
Conversation
This includes support for JSDOM-created elements, as well as real ones.
quantizor
changed the title
|
I actually don't think we need to do this pretty printing. I think the right solution is to change Jest to set the max depth to ~10-20 levels or so which should solve the Jest issue. |
|
@cpojer I'd rather fix the root issue than limit recursion. It's less surprising for other people using this library. |
|
I'm not sure if this is really the root issue. Jest would still crash if there is infinite recursion on a non-html object. I also don't think HTML printing should be a default. I don't actually want to pretty-print HTML elements in Jest like this. If we really want to do this, the right way is to build a plugin and then use instanceof checks with the objects coming from |
|
Well, I dumped 2 hours into this work. Do with it what you wish. |
|
I wouldn't mind a DOM plugin for pretty-format, I think that would be quite nice actually |
| expect(pretty).toContain('HTMLDivElement'); | ||
| expect(pretty).toContain('"className": "foo"'); | ||
| expect(pretty).toContain('"id": "bar"'); | ||
| expect(pretty).toContain('[HTMLSpanElement]'); |
There was a problem hiding this comment.
Rather than asserting the individual pieces can you assert the entire thing? Whitespace is often an issue
| @@ -228,6 +287,10 @@ function printComplexValue(val, indent, prevIndent, spacing, edgeSpacing, refs, | |||
| return hitMaxDepth ? '[Map]' : printMap(val, indent, prevIndent, spacing, edgeSpacing, refs, maxDepth, currentDepth, plugins, min, callToJSON, printFunctionName); | |||
| } else if (toStringed === '[object Set]') { | |||
| return hitMaxDepth ? '[Set]' : printSet(val, indent, prevIndent, spacing, edgeSpacing, refs, maxDepth, currentDepth, plugins, min, callToJSON, printFunctionName); | |||
| } else if (isHTMLElement(val, toStringed)) { | |||
There was a problem hiding this comment.
As mentioned in my other comment, would you mind moving this into a dom plugin that we could add to later on?
You can see some examples here: https://github.com/thejameskyle/pretty-format/tree/master/plugins
|
Yup, I think it's fine to add this as a plugin too! |
|
Node's util.inspect also displays |
|
@spicyj It should be doing that automatically. Since all the HTMLElements end up going through |
|
@thejameskyle I'll look into plugin-izing this later on. My code does make use of all the other functionality though, which is part of why I'm hesitant to migrate into a plugin. I'd be reimplementing all the nice handling that's part of the core lib. |
|
If you need something pulled into a separate file that can be required feel free to do that like this one: https://github.com/thejameskyle/pretty-format/blob/master/printString.js |
|
@spicyj pretty-format should be generating I'm not sure why it's not, maybe some weird DOM magic is causing the problem? |
|
I'll pick this up tomorrow after I vote |
This change is based on the feedback from @cpojer in jamiebuilds/pretty-format#47.
|
Going to close this for now - seems unnecessary since the library works as intended, plus some adjustments I made in #50. |
* Set maxDepth to fix infinite recursion for HTMLElements This change is based on the feedback from @cpojer in jamiebuilds/pretty-format#47. * Add an integration test to verify non-crashing
…#2078) * Set maxDepth to fix infinite recursion for HTMLElements This change is based on the feedback from @cpojer in jamiebuilds/pretty-format#47. * Add an integration test to verify non-crashing
…#2078) * Set maxDepth to fix infinite recursion for HTMLElements This change is based on the feedback from @cpojer in jamiebuilds/pretty-format#47. * Add an integration test to verify non-crashing
This builds upon and supercedes #45
Misc: also update Jest to latest