Proposal: Rework internal html representation and diff logic
- Dominant language
- JavaScript
- Stars
- 217
- Forks
- 45
- PR merge metrics
- No merged PRs in 30d
Description
I think we should use posthtml-like (bemjson-like) structure for internal representation to make diff calculation process cleaner and more flexible.
Current reports are non-informative on big projects.
Current way we comparing html documents leak on big files and don't feel quotes in attributes.
That's why we should think about core code refactoring.
## Representation proposal
```js
HtmlNode {
meta: MetaData, // Different meta data, raw string, another helpful data
tag: String,
classList: ClassesCollection, // Set of classes
attrs: Object, // Map of attributes with attrs meta info like quote types
//? dataAttrs: Object, // Map of data attributes
content: Array
}
```
## Samples proposal
```html
```
→
```js
{ meta: { diff: 'subset' }, tag: 'button', classList: ['button2'] }
```
## Report proposal
(Something like https://github.com/chaijs/deep-eql mixed with https://github.com/debitoor/chai-subset)
```diff
/x/path
- tag: 'button'
+ tag: 'button2'
.or .selector
+ attrs.missed: 'attr'
button.or like.or__that
+ classList[2]: 'missed-class'
```
## Futher possible features
- More accurate comparing methods where it needs (#144, #146).
- More clean diff calculation logic and testing possibilities (#139, #136, #127).
- HtmlNode can achieve additional fields to compare like `bemEntities` with a set of `BemjsonNodes` ot `BemEntityNames`.
- etc.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.