Tukukkk

I'm having an issue when I perform an array map prior to conv.ask. I'm getting an error related to a malformed JSON object, but as far as I can tell it should be valid.

const timetableCells = timetable.Trains.map((item) => {

  return {

    cells: [item.Line, item.Destination, item.Car, item.Min],

  }

})



conv.ask(new Table({

  title: `Rail Timetable for ${station}`,

  subtitle: 'Timetable as of x date',

  image: new Image({

    url: 'http://google.com/image.png',

    alt: 'Logo'

  }),

  columns: [

    {

      header: 'Line',

      align: 'LEADING'

    },

    {

      header: 'Destination',

      align: 'LEADING'

    },

    {

      header: 'Car',

      align: 'LEADING'

    },

    {

      header: 'Arrival',

      align: 'LEADING'

    },

  ],

  rows: timetableCells,

  buttons: new Button({

    title: 'Button Title',

    url: 'https://github.com/actions-on-google'

  })

}))

This is what timetable looks like:

{"Trains":[{"Car":"8","Destination":"Glenmont","DestinationCode":"B11","DestinationName":"Glenmont","Group":"1","Line":"RD","LocationCode":"B09","LocationName":"Forest Glen","Min":"9"},{"Car":"8","Destination":"Glenmont","DestinationCode":"B11","DestinationName":"Glenmont","Group":"1","Line":"RD","LocationCode":"B09","LocationName":"Forest Glen","Min":"18"},{"Car":"8","Destination":"Glenmont","DestinationCode":"B11","DestinationName":"Glenmont","Group":"1","Line":"RD","LocationCode":"B09","LocationName":"Forest Glen","Min":"36"},{"Car":"8","Destination":"Shady Gr","DestinationCode":"A15","DestinationName":"Shady Grove","Group":"2","Line":"RD","LocationCode":"B09","LocationName":"Forest Glen","Min":""}]}

If I log timetableCells I have an array that looks like this, and I'm assigning it to rows inside of conv.ask which should be equal to what Google Assistant is expecting according to their documentation.

[ { cells: ['1', '2', '3', '4'] }, { cells: ['1', '2', '3', '4'] } ]

If I stringify the JSON object I'm passing to conv.ask it looks correct:

JSON.parse("{"title":"Rail Timetable for Farragut North","subtitle":"Timetable as of x date","columns":[{"header":"Line","align":"LEADING"},{"header":"Destination","align":"LEADING"},{"header":"Car","align":"LEADING"},{"header":"Arrival","align":"LEADING"}],"rows":[{"cells":["RD","Glenmont","8",""]},{"cells":["RD","Shady Gr","8",""]}]}")

Where am I going wrong here? I know this line is the one causing the issue as I can replace it and it works correctly. The debugger points to a JSON validation error but I can't seem to see it.

This took a really long time for me to figure out, and it's weird that a different error wasn't thrown here. It was obvious that the data in the rows needed to match the amount of headers in the table, however what wasn't obvious was that the strings cannot be empty, otherwise you'll get a parsing error.

There were cases where some values were returned as empty strings from my API response which was causing the problem. Changing the code to the following fixed the issue as it ensures that they'll never be empty strings.

const timetableCells = timetable.Trains.map((item) => {

  return {

    cells: [item.Line || "N/A", item.Destination || "N/A", item.Car || "TBD", item.Min || "TDB"],

  }

})

I have just resolved very similar issue. The array that you are assigning to rows and cells has to contain Strings only. In a situation, where those are numbers, the 'failed to parse DialogFlow response int AppResponse' will happen.