Smol bug that I've found but I still need to docum...

# compose-web

[MrPowerGamerBR]

Smol bug that I've found but I still need to document it better: While I was trying to integrate EasyMDE in Compose, I found out that if you call a "mutableStateOf(...)" variable within a "ref" block, the compiler will crash with "`Validation failed in file`"

(Semi) Unrelated to the bug above: And here's how I ended up implementing it if anyone is interested :3 (the EasyMDE classes were generated by dukat).

I know, it seems kinda obvious in handsight but I was banging my head trying to figure out how could I force a recomposition of a "ref" block (even if the "i18nContentDataMap" variable changed, it wasn't recomposing, because "ref" is only called if the element was removed from the current composition), which then I figured out that what I should do is create a div and then create the textarea with JS code. You can't use DomSideEffect within a TextArea because you aren't able to access it there https://gist.github.com/MrPowerGamerBR/bba1208e3db6a29b51cd350f9cf904f4

[MrPowerGamerBR]

Okay now about the bug itself, here's the code that causes the issue: https://gist.github.com/MrPowerGamerBR/953fefd30ab97510da1f534822714432

And here's the stacktrace: https://gist.github.com/MrPowerGamerBR/6c93c64ff76e1d858dad6d7e0a487f3f

[Big Chungus]

Isn't ref block exclusive to attrs builder block which in itself is not a composable?

[Big Chungus]

Therefore all composable function invocations are invalid there.

[Big Chungus]

Move your mutable state into composable scope above TextArea

[MrPowerGamerBR]

@Big Chungus the issue is in the "i18nContentDataMap.content = easyMDE.value()", if I remove that, then the compiler doesn't crash, and it would be impossible to move that, because it requires the "easyMDE" instance

[MrPowerGamerBR]

and it also seems a bit finicky, sometimes it crashes with that error, sometimes it doesn't...

In the "this works!" gist, this is the workaround that I did

var _title = mutableStateOf<String?>(null)
var _content = mutableStateOf<String?>(null)
var title by _title
var content by _content

And then using the _title and the _content variables within the callback, then the compiler doesn't crash

[Big Chungus]

Are you sure there's always the same instance if testData passed in? I don't see any remember {} statements

[MrPowerGamerBR]

Same instance of testData? No, it is different testData's, they are stored in my ViewModel

I think a GIF explains better what is the purpose of that testData 😛

Context: Got fed up with editing markdown files manually for my blog so I'm creating a very simple CMS with Compose

[MrPowerGamerBR]

I'm still not 100% sure what causes the crash, but here's an example of it happening when I added a "println(data.content)" in the callback. It already happened before without that println call, so idk what is really causing the issue

I don't think it is related to Composable blocks because "mutableStateOf" doesn't need to be within a Composable block (like a remember block)

(ignore the unrelated classes in the video, they are present because I copied the code from my other Compose Web project K)

M4rskygbmr-1.mp4