Allow message_progress_bar to be a function

[Shaobin-Jiang]

I have encountered this situation many times when I want to update the progress bar message when the progress bar updates, but the only way of doing it before is manually changing the innerHTML in an on_finish function of a trial. Therefore, I think we should allow users to set message_progress_bar as a function that returns the progress, so that the message gets updated automatically.

For example:

const jsPsych = initJsPsych({
    show_progress_bar: true,
    auto_update_progress_bar: true,
    message_progress_bar: (progress) => `Current progress: ${progress * 100}%`
});

[changeset-bot]

🦋 Changeset detected

Latest commit: 4cb77e8

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
jspsych	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[jodeleeuw]

Thanks @Shaobin-Jiang! This seems useful to me.

@jspsych/core what do you think about having message_progress_bar be a string or function? Should it just be a function?

[Shaobin-Jiang]

I personally think message_progress_bar could either be a string or a function. There must be many who are happy with displaying just an unchanging message along side with the progress bar. Also I believe in this way message_progress_bar can behave like a dynamic parameter.

[bjoluc]

I tend to agree with @Shaobin-Jiang. Also, supporting both really doesn't add much complexity implementation-wise.

[bjoluc]

I've added some review comments – @Shaobin-Jiang let me know if you'd like to address them or if I should quickly do the changes. Also, the function parameter is lacking a unit test 🙃

[Shaobin-Jiang]

Unit test is added as requested @bjoluc