Last week was all about documentation and creating a skeleton of our report website as well as improving the UI. This included getting ready the JSDoc style in-code documentation and docs specifying the limits of our system.

Goals

<aside> 🎯 **What are we looking to achieve?

1. Unit Testing the UI** This week, we ****have taken on more feedback from users and iterated once again on our UI and we plan to thoroughly unit test the UI. This ensures that when a clinician is clicking around our application, the right data is displayed and the expected pages are shown.

2. Publishing NPM Packages Now that we have this Unified Bot Format where we are able to take a Voiceflow file, convert it to this standard format and use our own format to start uploading chatbots to Twilio, we thought it would be best to separate the UI from this logic and turn them into packages developers can use.

3. Working on the Report Website. We only took on trying to get a skeleton of the project website up and running during this week. This will house all our research, how we implemented everything and all relevant documentation.

</aside>

Unit Testing the UI

The UI has taken a major part of our time, mostly in order to ensure adequate HCI design. It wasn’t a testing priority for our team. Nonetheless, we have produced thorough unit tests going through and testing each individual page of the UI.

To do these tests we used an open-source JS testing framework called Jest which acts as an assertion library and gives us the ability to mock certain parts of the UI. The great thing about Jest is that tests are isolated and can be run in parallel which enables us to create a huge test suite that can be run in seconds.

Publishing NPM Packages

vf-to-ubf

To modularise our system, we have a singular package that is responsible for taking a Voiceflow file and converting it to our Unified Bot Format.

import {voiceflowToBotFormat} from 'vf-to-ubf';
var fs = require('fs');

voiceflow_diagram = fs.readFileSync("./VoiceflowFile.vf")
universal_format = voiceflowToBotFormat(voiceflow_diagram)

All you have to do is pass in your Voiceflow file to the package and the UBF equivalent is returned. This allows you to:

• Only extract the key information from the Voiceflow file and remove redundant metadata.
• Guarantee that you have a full complete chatbot within the Voiceflow with JSON Schema validation.
• A standard format that can be used to build packages on top of such as ubf-to-twilio.

ubf-to-twilio