prodigyanswer fired multiple times

,
1

Hello,

If we add a simple JS

document.addEventListener("prodigyanswer", event => {
    console.log(event);
});

On first answer, prodigyanswer is fired once, on second answser twice, thrice on third, and so one.
Any idea why?

Thanks!

2

Hi! I think what might be happening here is that the event listener is somehow registered multiple times, maybe because the JavaScript code is re-rendered as you move between tasks (which shouldn't happen). How does the rest of the recipe look?

In the meantime, does it solve the problem if you name the function explicitly and only add the listener on mount?

function onAnswer(event) {
    console.log(event)
}

document.addEventListener('prodigymount', event => {
    document.addEventListener('prodigyanswer', onAnswer)
})
3

Hi Ines,

thank you for your answer.

I'm using Prodigy 1.9.7

The return function of the recipe is

return {
    'dataset': dataset,
    'view_id': 'html',
    'stream': stream,
    'config': {
        "javascript": test_js,
        "global_css": global_css
    },
}

and the test_js file is

function onAnswer(event) {
    console.log(event);
}

document.addEventListener('prodigymount', event => {
    document.addEventListener('prodigyanswer', onAnswer)
});

The issue is still here (1 event for the first answer, 2 for the second, and so on)

If I add a console.log on prodigymount

function onAnswer(event) {
    console.log(event);
}

document.addEventListener('prodigymount', event => {
    console.log(event);
    document.addEventListener('prodigyanswer', onAnswer)
});

This is what I get on Browser Console

*On Load*
CustomEvent {isTrusted: false, detail: null, type: "prodigymount", target: document, currentTarget: document, …}

*On first Answer*
CustomEvent {isTrusted: false, detail: {…}, type: "prodigyanswer", target: document, currentTarget: document, …}
CustomEvent {isTrusted: false, detail: null, type: "prodigymount", target: document, currentTarget: document, …}
CustomEvent {isTrusted: false, detail: null, type: "prodigymount", target: document, currentTarget: document, …}

*On second Answer*
CustomEvent {isTrusted: false, detail: {…}, type: "prodigyanswer", target: document, currentTarget: document, …}
CustomEvent {isTrusted: false, detail: {…}, type: "prodigyanswer", target: document, currentTarget: document, …}
CustomEvent {isTrusted: false, detail: null, type: "prodigymount", target: document, currentTarget: document, …}
CustomEvent {isTrusted: false, detail: null, type: "prodigymount", target: document, currentTarget: document, …}
CustomEvent {isTrusted: false, detail: null, type: "prodigymount", target: document, currentTarget: document, …}

Thank you

4

Thanks, this is very helpful! Turns out the problem is that the whole annotation card keeps mounting and unmounting on each task, which shouldn't be happening :thinking: And the data you're loading in is just basic HTML, right?

Let me try and reproduce this!

(I guess as a temporary workaround, you could try and remove the event listener after you've executed the callback. I think this should work? Although, you might be hitting a race condition here if the current task changes before the code has a chance to execute.)

5

Yes, there is just an empty html (or even no html), only the javascript.

I can't manage to make it work using removeEventListener :confused:

Thank you

6

Hi Ines,

by any chance, did you manage to reproduce this?

Thank you

7

I'm really struggling to reproduce this, sorry! Here's my test recipe:

TEST_JAVASCRIPT = """
document.addEventListener('prodigymount', () => {
    console.log('mounted!')
    document.addEventListener('prodigyanswer', ev => {
        console.log('answered!', ev.detail)
    })
})
"""


@prodigy.recipe("test-html-mount")
def test_html_mount():
    stream = [{"html": f"<strong>Hello {i}</strong>"} for i in range(100)]
    return {
        "dataset": False,
        "view_id": "html",
        "stream": stream,
        "config": {"javascript": TEST_JAVASCRIPT},
    }

If I run this with the latest version of Prodigy, the prodigymount event fires once, and on each answer, the prodigyanswer event fires :thinking: Can you try it out and see if it works for you, or if it also surfaces the same problem for you?