when opening form and automatically going to dn widget on an image-map question, the image map ends up in the dn modal

[MartijnR]

Looks like we should wait for widgets to be initialized before 'goto' opens the dn modal.

[pbowen-oc]

Here is an example:

[MartijnR]

http://localhost:8005/view/fs/i/acefc9353e1386051bec92da9669bda3#%2Fdemo-vitals-grid-v9%2Fpage2%2Fus_map_comment

• try to delay image map loading to reproduce - cannot

Cannot reproduce and think my initial hypothesis may not be correct either when I try to follow the code.

• check if cause could lie in dn widget - don't think so either

[MartijnR]

@pbowen-oc could you provide the XForm please?

[pbowen-oc]

@MartijnR - Here you go:
vitals_27b.xform.txt

[MartijnR]

http://localhost:8005/view/fs/i/a878a840386e39fc6704389f26b0b1eb#%2Fdemo-vitals-grid-v27b%2Fpage2%2Fus_map_comment

I actually don't see the modal dialog. It's somewhere below the visible screen and I cannot scroll to it. I do see the question and it has the image map. So still a problem to reproduce (and another scroll issue).

[theywa]

Hi @MartijnR ~ I found cause why the image-map printed on the widget comment, it's because this code
that.question.querySelector( '.option-wrapper' ).before( fragment );
on _addMarkup function at image-map.js. There will be more than one '.option-wrapper' when the comment widget loaded and because the comment widget loaded first then that selector will pick the element from that widget and append it before that element.
And to fixed that we need to modify the selector like this
that.question.querySelector( 'div[class=option-wrapper]' ).before( fragment );

that would fix the image map position but there is a new issue with the scroll to view the comment widget so I added a timeout to delay the comment widget.

[MartijnR]

That sounds promising! Could you perhaps post the DOM showing the multiple option-wrappers?

[theywa]

Sure, here the Inspect element ss

and here the ss from console testing