Thimble PR #242

Issue

This pull request involved the project rename/publish functionality. The issue was that the project title is part of the project’s remix data which was not being checked when updating project changes to the physical files that are stored in S3. This resulted in the project title remaining the same in S3 after renaming, saving and publishing project title changes. To fix this, I compared the project and published project metadata for any changes which would then trigger the update functionality to force upload HTML files on a project rename.

Debugging + Vagrant issues

Since the files that required changes were written in the publish.webmaker.org portion of the project, I could no longer test code using the Chrome DevTools since the files to be changed were on the server-side, not client side. I spent some time trying to set up my VS code to use remote debugging for this. After trying out several solutions from numerous threads, I was unable to get VS code to run Thimble while stopping at set breakpoints and eventually decided to use console debug statements to test my changes.

Each time a change was made, a vagrant halt/up was required to apply the changes server side. This took about approximately 7 mins which was unreasonable to do this each time to test the changes. So I filed a bug in the Thimble repo here detailing the issues I had encountered each time during the vagrant up. After pulling a recent merge regarding node_modules and nunjucks, the up time decreased to about 3 mins which was significantly better.

I had also found that in my initial Vagrant set up, the default installation folders for VM snapshots and other VM files were being saved to my Windows user home folder which contained a space character in it. This was another cause for many issues since Ruby (which is used in Vagrant) does not deal with space characters in directories well. I changed this through Oracle VirtualBox GUI in Preferences > General > Change “Default Machine Folder”.

New discoveries

An interesting tool I came across while working on this bug was the knex query builder which the Thimble project uses to build queries for their PostGres database.

A knex query would look something like:

    return new this.PublishedFilesModel()
    .query()
    .where(this.context.column(`published_id`), publishedId)
    .where(this.context.column(`path`), `like`, pattern)
    .whereNotIn(this.context.column(`path`), ignorePaths)
    .select(
      this.filesTable.column(`id`),
      this.filesTable.column(`path`),
      this.filesTable.column(`buffer`)
    );

This uses the query statement to fire up the query, where, whereNotIn, and select as the Query builder statements to return the appropriate matching PublishedFilesModel object.

Conclusion

This bug was one of the more difficult ones to work on since it required server side debugging. I also had to fix the issue with my vagrant setup to help the development process. Nonetheless, this was a good learning experience as I was introduced to some new technologies while contributing to this open source project.

Advertisements