Draft-js: Nesting multiple decorators possible?

[pklavins]

Do you want to request a feature or report a bug?
Not sure, could be either.

What is the current behavior?
Currently applying a CompositeDecorator with two strategies will not apply both decorators to the same chunk of text if it matches both strategies.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem.
Reproduced the issue here: https://jsfiddle.net/m6z0xn4r/634/.

What is the expected behavior?
I expect 'nested' styles, e.g. in the fiddle with this text: [test @text here] I'd expect it all to be blue text with @text having a red background (and preserving blue text). Instead just the @text has red background, no blue text. If I invert the decorator strategy/component order, it'll show all blue text with no red background.

Which versions of Draft.js, and which browser / OS are affected by this issue? Did this work in previous versions of Draft.js?
Not sure if it's ever worked, 0.10.3, Win10, Chrome 64.0.3282.186

[carterw485]

I also need this functionality. I found this draft-js-multidecorators npm module, but when using it, I don't get contentState passed into my strategies.

Edit:
To make draft-js-multidecorators pass the contentState it, modify the index.js on lines 15 and 19, and just add state as a parameter in the declaration and the call for .getDecorations.

Edit again:
Whichever decorator you pass in last seems to override the previous one, and doesn't give the desired functionality.

[JM-Mendez]

Take a look at what @paulyoung did over here https://github.com/facebook/draft-js/issues/542#issuecomment-275996606. He seems to have rewritten the composite decorator class to support nested components.

Here is a working codesandbox of your use case https://codesandbox.io/s/5ykjy4nvmp

[cuicq]

I also need this functionality. I found this draft-js-multidecorators npm module, but when using it, I don't get contentState passed into my strategies.

Edit:
To make draft-js-multidecorators pass the contentState it, modify the index.js on lines 15 and 19, and just add state as a parameter in the declaration and the call for .getDecorations.

Edit again:
Whichever decorator you pass in last seems to override the previous one, and doesn't give the desired functionality.

I used your method to successed, thank you!