Class pace-done added to body multiple times

[Matt Snider]

Hi there,

Thanks for this great library! It looks great and works very well, although I am having one minor issue.

Recently I noticed that on each navigation or request, the pace-done class is being added to body and not properly cleared on the next run. This doesn't affect the functionality, but over time, many duplicate instances of this class accumulate.

The fact that no one else has reported this leads me to believe that I might be making a mistake, or there is some issue specific to my setup. But I guess we'll see if anyone else reports the same behaviour. I'm hoping that someone might have some idea what could be causing this.

Some information that might be helpful:

• I'm using the latest version (v1.2.3)
• I'm using pace in a Vue (v3) Typescript app
• I'm using vue-route and navigate using the HTML5 History Mode
• I'm using Axios to make requests to an API
• The application is built using vue-cli-service which uses webpack to bundle everything
• I initialize pace with import "pace-js" in main.ts
• This looks kind of like #206 (or the inverse at least)

[wsteven24]

Same issue over here. I'm using v1.2.4

[Michael Arawole]

Having the same issue also. Keeps adding unnecessary spaces too

[Slava Egorov]

Same for me

[Browniebraun]

There is a pipe within the search pattern to replace pace-done by class pace-running which should not be in.

Replace line 276:
document.body.className = document.body.className.replace(/(pace-done )|/, 'pace-running ');

by

document.body.className = document.body.className.replace(/(pace-done )/, 'pace-running ');

Afterwards it will stop that nasty misbehavior.

Regards
-Andi

[Matt Snider]

@browniebraun Would you like to open a PR with this change?