Vue-good-table: Error on sorting boolean field. Maybe need to add boolean type?

[mgd722]

Issue Type

• [x] Bug

Specs

What version are you using?
2.4.4

What browser?
Chrome Version 66.0.3359.139 (Official Build) (64-bit)

Expected Behavior

What did you expect to happen?
I expected to be able to sort a column by a boolean value.

Actual Behavior

What actually happened?
Clicking the column header of my boolean value logged an error to the console and broke sorting on all columns until table refresh.

Steps to Reproduce the Problem

Please detail your steps here

1. Open the jsfiddle below.
2. Try to sort the "active" column.
3. Weep.

jsfiddle

https://jsfiddle.net/gn5ubo8a/2/

[mgd722]

The error, TypeError: d.toLowerCase is not a function, makes sense-- the sorting algorithm runs by lowercasing the text before evaluation so we're comparing apples and apples. This fails on boolean values however, because true.toLowerCase() isn't a thing. Simplest solution I can think of is to cast the values to string before lowercasing them.

[xaksis]

ah! good catch @mgd722 I think we need a type boolean for vgt column. I'll work on it. out of curiousity, how do you show boolean on the table? string "true"/"false"?

[mgd722]

Yeah, my current workaround is to cast the boolean to string (just "true"/"false") by passing a function to the field instead of the field name: https://jsfiddle.net/gn5ubo8a/3/. This works alright, but prevents me from passing the field name to initialSortBy since there isn't really a field name. This isn't a big deal for my use case, but I could see that getting in the way somewhere else.

[xaksis]

column type boolean now added in v2.5.5

closing.

[mgd722]

Awesome! Thanks for all the work you put into this; it's much appreciated!

[LeCoupa]

@xaksis does it make sense to add the type "array" and "object" also? I am trying to sort on a column that is an array of objects containing an id) and I get the same error.

sortFn(x, y) {
  if (!x && !y) {
    return 0
  } else if (x && !y) {
    return 1
  } else if (!x && y) {
    return -1
  } else {
    x = x[0]
    y = y[0]

    return x.id < y.id ? -1 : x.id > y.id ? 1 : 0
  }
}

[xaksis]

hey @LeCoupa! Do you mind opening up a new ticket? It's better for me to keep a record of current discussion if it's not on closed tickets.