How to color text per cell based on the text's value?

[daldr-ntml]

I would like to change the text color of a table cell depending on its value.

new gridjs.Grid({
  columns: [
    { id: 'testcase', name: 'Test case' },
    { id: 'date_run', name: 'Date run', sort: false },
    { id: 'result', name: 'Result', sort: false },
  ],
  data: [
    {% for user in users %}
      {
        testcase: '{{ user.testcase }}',
        date_run: '{{ user.date_run.strftime('%H:%M %d-%m-%Y') }}',
        {% if user.result == "Pass" %}
          result: '{{ user.result }}',
        {% else %}  
          result: '{{ user.result }}',
        {% endif %}
      },
    {% endfor %}
  ],
  search: {
    selector: (cell, rowIndex, cellIndex) => [0, 1, 4].includes(cellIndex) ? cell : null,
  },
  sort: true,
  pagination: true,
  width: 1000
}).render(document.getElementById('table'));

user.result is a string, taking the values 'Pass' or 'Fail'. If the value is 'Fail' I would like the text to be red, if 'Pass' black. How can I achieve that?

Actually, it would be better for the database value to be a boolean, how should the if syntax be changed for that?

[craigarms]

Hi,

Look at the docs with the formatter, this enables you to return html for a cell :)
I think thats what you need

https://gridjs.io/docs/examples/html-cells