Code Component: Python translation to JS doesn't show full text of string when including formatted text

Builder
1

Hello everyone!

Today I would like to share a very minor inconvenience I encountered while writing Python code in the Code Component and autotranslated to JS with the code type option “Auto → JS”. I am using Psychopy 2024.2.4 for Windows 11 x64 with Python 3.8.

I am currently (still, don’t ask why) writing code for a go/no-go task. I created a code component which features an instruction text appearing at the beginning of the experiment.

Since this experiment has two possible counterbalancing routines (the “go” color can be either blue or yellow), the text needs to be formatted to display the correct color for each “go” and “nogo” condition based on the counterbalancing type. To see how to include text formatting in Psychopy, look up this tutorial. Here’s how mine looks like:

inst = "Welcome!\n" \
"In this task you will always see a %s or %s square.\n" \
"Your task each time is to press \"J\" as quickly as you can whenever you see a %s square.\n"\
"Since you need to respond within half a second, you will have to be very quick!\n"\
"Be careful! When you see a %s square, you should NOT press the key." \
"In this case, you just wait until the next square appears.\n"\
"You have to respond as QUICKLY and as ACCURATELY as possible.\n"\
"Press the SPACEBAR to continue." %(goCol, nogoCol, goCol, nogoCol)

So far so good. However, the autotranslated JS code looks like this:

inst = `Welcome!
In this task you will always see a ${goCol} or ${nogoCol} square.
Your task each time is to press "J" as quickly as you can whenever you see a ${goCol} square.
Since you need to respond within half a second, you will have to be very quick!
Be careful! When you see a ${nogoCol}`
;

As you can see, the text string is interrupted when the last formatted string is inserted.

When I pilot my experiment in Runner, the text displays correctly, including the formatted fields.

Again, I don’t think this is a major problem. I shared this in case someone who doesn’t have much coding experience like myself fears there is some hidden syntax error/mistake.

Cheers!

2

Hello

Did you try to add the missing text manually after

${nogoCol}

before the ` ?

Set the Code type to Both to edit the JS-side.

Best wishes Jens

1 Like
3

Hi!

Based on your suggestion, I have updated the code as such:

inst = `Welcome!
In this task you will always see a ${goCol} or ${nogoCol} square.
Your task each time is to press "J" as quickly as you can whenever you see a ${goCol} square.
Since you need to respond within half a second, you will have to be very quick!
Be careful! When you see a ${nogoCol} square, you should NOT press the key. In this case, you just wait until the next square appears.
You have to respond as QUICKLY and as ACCURATELY as possible.
Press the SPACEBAR to continue.`
;

I actually didn’t think about running it online. The autotranslated code is shown cut. By adding it manually, the code works and it is correctly displayed like it is offline in the Builder.

Thanks for your help!

4

If you aren’t running it online, I would stick to Auto Components to check your syntax, but not worry about whether the JS code that gets created will actually work.

1 Like