Not a Nuxt module, but a module nevertheless. Photo by Mark König on Unsplash

I have already explained how we can use MSW to test our Nuxt application’s communication with the backend. I made it work by importing axios and assigning wrapper.vm.$axios = axios.

However, this is actually a bad hack, since @nuxtjs/axios and axios aren’t the same. The former is a Nuxt.js module that wraps axios and offers more functionality on top of it. @nuxtjs/axios and axios happen to have a similar API which enables us to use the latter in place of the former and mock any additional methods we use (such as setToken). But what will we do in other cases…

Photo by on Unsplash

This isn’t a Nuxt testing issue; it’s a Vue testing issue. All the same, it’s going to affect people working in Nuxt as well.

However, whenever you have a Vue (rather than a Nuxt) testing issue, the answer is likely to be in the excellent book “Testing Vue.js applications” by Edd Yerburgh, which you should really read. It’s going to save you from lots of headaches.

I have a LoginForm component that uses a modal. LoginForm looks like this (I’ve deleted everything that isn’t relevant to the issue at hand):

I want to test that when the modal appears…

The River Axios; Photo by dimitris pantos on Unsplash

Using MSW

The most common answer to the problem of how to test communication with the backend is to mock fetch or axios or whatever library you use for making http requests. However, StackOverflow user jonrsharpe proposes a better method: use msw, the Mock Service Worker. It works by essentially creating a server that intercepts requests on the network level. Here is an example:

The server we have created responds to login requests:

  • If the username and password are alice and topsecret, it responds with a token
  • If the username and password are alice and wrongpassword, it responds with an error…

I wanted to test this loggedOnUser() function:

So at first I tried this:

Unfortunately this fails with a loud bang. It isn’t even able to mount the component. The reason is that the component needs to use loggedOnUser() during mounting, and this.$store is undefined.

When Nuxt runs normally, it automatically loads machinery that causes things like this.$store to exist. This machinery isn’t loaded when we try to run the test above; you need to load it manually. Unfortunately, the documentation is silent about how to do this, and people have complained about this silence.

On 23 March, a number of organizations and individuals signed an open letter asking to remove Richard M. Stallman from all leadership positions. It also asks the FLOSS community to boycott the Free Software Foundation.

Dear signatories,

I am very sad about the letter, and it doesn’t have much to do with Stallman. It has to do with the letter and only with the letter. If I hadn’t met some of you personally, I would have dismissed it and moved on. But since I know and respect many of you, I’m just sad.

I know Stallman can be a difficult…

Do you ever have trouble with encodings? I used to in the past, but now I rarely do, because I do a simple thing. While knowing the things I explained in part 1 and part 2 of this series is necessary, otherwise I wouldn’t be able to fix problems, such problems rarely arise, because the first thing I do when I setup a GNU/Linux machine is set the system locale to UTF-8.

The “locale” is the regional settings, among which the character encoding used. The procedure to set it up is this:

  1. Open the file /etc/locale.gen in an editor and…

As we saw in part 1 of this series, each program reads stuff from input and writes stuff to output. Whenever it reads strings of characters in the input, these strings are encoded in a certain encoding such as UTF-8. The program must decode these strings into an internal representation. When writing to the output, the program encodes strings from its internal representation to an encoding such as UTF-8.

What this internal representation is is usually not our concern. For example, in Python versions earlier than 3.3, the internal representation is either UCS-2 or UCS-4, depending on how Python was…

Has a UnicodeEncodeError ever got on your nerves? I think it has happened to pretty much everyone. I thought it’s a good time to start demystifying this mystery, and to have fun while doing it.

You are probably familiar with the famous hello program, which does nothing but print “Hello, world!” Now we are going to create the bon program, which prints “Bon appétit!” Here it is, but don’t type it in or copy/paste it:

import sys

sys.stdout.write("Bon appétit!\n")

We could have written it with a single print statement, but for several reasons I prefer this version.

Now, I told…

This is an interview I took from Estonian Django developer Rivo Laks about Docker. Recorded in DjangoCon EU 2017, Florence, Italy.

A: Hello everyone, this is Antonis from The date is 7 April 2017 and I am in Florence, Italy, at the European Django conference. I’m sitting with Rivo Laks, who is a developer from Estonia. He has a company called Thorgate, and we are going to be talking about Docker and similar things, mostly about deployment. Hello Rivo, how do you like the conference?

R: Hello Antonis. I like it a lot and I think it’s my fifth…

This is an interview I took from Django core developer Andrew Godwin about deployment. Recorded in DjangoCon EU 2017, Florence, Italy.

ANT: Hello everyone! This is Antonis from It’s 5 April 2017 and I am at the European Django Conference in Florence. I am sitting with Andrew Godwin, who is a Django core developer mostly known as the creator of migrations and now Django Channels, and we are going to have a little chat about deployment. Hello Andrew!

AND: Hello! It’s lovely to talk to you!

ANT: Thanks! Some years ago you tried to create a deployment service which…

Antonis Christofides

I help scientists and engineers bring their models to the web

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store