Skip to content

Conversation

@elchininet
Copy link
Contributor

This pull request fixes a bug related to some of the value directives and the important property of a declaration.

Some value directives assume that if the important property of a declaration is true, then raws.important has a value (the place of the directive). This is the case if the important is coming from the source code and the directive has been placed after !important, but that is not the case, for example, if important was set by a previous postcss plugin. In these cases, the important property is true but raws.important is undefined, because the CSS in those cases will be something like this (the directive will end before the important):

declaration: value /*directive*/ !important;

And in those cases the next error will be thrown:

Uncaught TypeError: Cannot read properties of undefined (reading 'substr')
    at /CWD/example.css:3:3
    at Object.action (/CWD/node_modules/rtlcss/lib/plugin.js:184:141)
    at /CWD/node_modules/rtlcss/lib/rtlcss.js:136:27
    at /CWD/node_modules/rtlcss/lib/util.js:259:37

Because of these types of conditions:

decl.important ? decl.raws.important.substr(9).trim() : ''
                                    ^
                                    |
                          /* important is undefined */

The solution is just to check for the existence of raws.important before trying to access to its string methods:

decl.important && decl.raws.important ? decl.raws.important.substr(9).trim() : ''

Closes: #329

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

Successfully merging this pull request may close these issues.

RTLCSS errors when processing a value directive marked as important

1 participant