Correction of the work with comments and general improvements #163
Conversation
Added a test to check the work with comments The existing tests have been changed because they contained incorrect data.
index.test.js
Outdated
| @@ -605,17 +605,21 @@ test('clears empty selector after comma', () => { | |||
| }) | |||
|
|
|||
| test('moves comment with rule', () => { | |||
| run('a { /*B*/ /*B2*/ b {} }', '/*B*/ /*B2*/ a b {}') | |||
| run('a { /*B*/ /*B2*/ b {} }', 'a { /*B*/ /*B2*/ } a b {}') | |||
There was a problem hiding this comment.
Is it a expected output?
.block {
/* Element comment */
.element {
}
}will not be moved too?
There was a problem hiding this comment.
I didn't understand you.
Your code should be converted to:
.block {
/* Element comment */
}
.block .element {
}It was from this logic that I transformed the test.
UPD: The code that was previously in the test was wrong - comments should not have left the rules in which they were embedded.
I've changed the logic and tests so that they stay inside the rules.
There was a problem hiding this comment.
Your code should be converted to
Is it expected output?
Seems like very soon other developers will come and will open new issues asking to not move this kind of comments
There was a problem hiding this comment.
Do you really think that the comments embedded in the rules should remain outside?
If a comment is embedded in a rule, it should remain in it. If a comment is not embedded in a rule, it must be outside of it. It's logical, isn't it?
There was a problem hiding this comment.
In fact, the plugin originally assumed this logic - when I wrote a comment in the rule, it remained in it (see the original issue). But in one of the cases there was a mistake that I fixed.
There was a problem hiding this comment.
I use the library to convert CSS to HTML. In order to set the text for the elements, you need to enter it somewhere.
At first, custom properties were the solution, but they have a problem - they do not allow you to process multi-line texts.
For the correct processing of such text, I decided to use comments with a special mark, like this:
p {
/* text:
Lorem ipsum ipsum lorem
Выходила на берег Катюша
*/
a {
--attr-href: 'https://www.npmjs.com/package/posthtml';
--attrs: 'target="_blank" rel="noopener noreferrer"';
}
}Assigning text from comments when it is outside tags is quite problematic and illogical - the text must be inside the tag anyway, moreover, based on some features of working with CSS, I have an option to write text before and after the tag:
p {
/* text-before:
Lorem ipsum ipsum lorem
Выходила на берег Катюша
*/
}There was a problem hiding this comment.
Got it. The problem is that it is unique feature for mostly 1-2 people. I do not want to change behvaiour for everyone.
The suggestions:
- You write a plugins which will run before (to hide comment to
Rule.props) and afterpostcss-nested(to restore them). - We can add
keepCommentoption to thepostcss-nestedbut only if it will be very small to not reduce code maintaibility.
There was a problem hiding this comment.
There is another option: most often (a matter of formatting) there is an empty space between the properties and the nested rule. If they want to describe a rule with a comment, the comment is "pressed" to the rule from above, leaving no space.
This can be used to separate comments into those that cannot be left inside the rule and those that can.
Example:
p {
/* comment inside the rule, save as is */
/* comment for the rule below, move with the rule */
a {
}
}There was a problem hiding this comment.
Yes, let's use empty new line to detect it
There was a problem hiding this comment.
Okay, I'll take care of it in the next few days and let you know when the result is.
|
Well, or something like that. I didn't seem to miss anything. |
|
It's a pity that he complains about the operator |
|
Hm, it may be an ESLint issue since we should support |
|
I will look |
| }) | ||
|
|
||
| test('moves comment with at-rule', () => { | ||
| run('a { /*B*/ @media { one: 1 } }', '/*B*/ @media {a { one: 1 } }') | ||
| test('Save the comments for the parent and child', () => { |
There was a problem hiding this comment.
Can we add test with \n like:
a {
/*i*/
b {} }Seems like often you will not have inside-commend.
There was a problem hiding this comment.
We can add it. I've already checked, it will work properly.
There was a problem hiding this comment.
Yes, let's add it to not break in the future
|
I removed Node.js 12-16 support from |
|
Haven't heard from you for a long time, have you been waiting for me to add a test? |
Yes |
No comment, it's fabulous. |
|
Thanks. Released in 7.0. |
List of changes:
foreachhas been replaced withfor, and some methods have been optimized.All tests were passed correctly.