v-chakra directive bug : flash of unstyled content when applyed on a external component #436
Labels
status: needs more info 🤔
Needs more information about a specific thing/problem
status: needs reproduction ♺
Issue needs a simple reproduction
type: contributions welcome 💚
Contributions are welcome!
Compare this two :
1 V-chakra directive on a nested component
test.vue
DabadiDabada.vue
2 V-chakra directive on an component living inside the parent
test.vue
Results
In both case, it works like above, however you get a flash of styling on case 1.
If you disable javascript (Safari dev menu), styling isn't applied:
With js
Style appended with "className" appendix is added afterward (hence the flash of styling).
![Screenshot 2021-05-31 at 23 58 58](https://user-images.githubusercontent.com/603498/120245079-64e64080-c26c-11eb-93be-a61be63864b4.png)
No js
No style is appended
![Screenshot 2021-05-31 at 23 58 41](https://user-images.githubusercontent.com/603498/120245083-657ed700-c26c-11eb-9704-edc7bf0ffaf5.png)
Additional note :
If you add some styling on a root chakra component in
![Screenshot 2021-06-01 at 0 04 12](https://user-images.githubusercontent.com/603498/120245243-e9d15a00-c26c-11eb-9143-4762543aa171.png)
DabadiDabada.vue
, it works along the v-chakra styling on the parent. Still, the styles coming from v-chakra directive suffers from being added afterwards.The text was updated successfully, but these errors were encountered: