return-type custom class doesn't apply style

[dxwil]

Make sure not to make this mistake in your custom modules. Let's say this is your module:

"custom/battery": {
"exec": "~/.config/waybar/scripts/battery.sh",
"interval": 60,
"tooltip": false,
"signal": 7,
"return-type": "json"
},

This script will work:

#!/bin/bash
capacity=$(<"/sys/class/power_supply/macsmc-battery/capacity")
if [ "$(<"/sys/class/power_supply/macsmc-battery/status")" = "Charging" ]; then
unbuffer echo "{\"text\":\"$capacity%\",\"class\":\"charging\"}"
else
unbuffer echo "{\"text\":\"$capacity%\"}"
fi

This script will not work:

#!/bin/bash
capacity=$(<"/sys/class/power_supply/macsmc-battery/capacity")
unbuffer echo "{\"text\":\"$capacity%\"}"
if [ "$(<"/sys/class/power_supply/macsmc-battery/status")" = "Charging" ]; then
unbuffer echo "{\"text\":\"$capacity%\",\"class\":\"charging\"}"
fi

Always put the json with more variables to be displayed first, because otherwise it will be overshadowed by the other one.