pie-framework / pie-elements

A collection of pies for rendering interactions in an assessment environment
http://pie-website.surge.sh
ISC License
0 stars 7 forks source link

[MC] Images in existing data won’t show up in editor #45

Closed PowerMyLearningConnect closed 6 years ago

PowerMyLearningConnect commented 6 years ago

Images in existing data won’t show up in editor, it renders though (right section). Please let us know if our data needs to be fixed, json can be found @ "..\mc\image.json" in demo repository. http://sbox.powermylearning.org/piedemo/MultipleChoice_Image_Example.html https://github.com/paritoshcardinal/pie_elements_demo/blob/master/mc/image.json

image007

@edeustace @elodszopos @narayankj

narayankj commented 6 years ago

@edeustace @elodszopos I see images doesn't show up in editor when <img> tag is wrapped by <p>(if img has parent element) tag

"prompt": "<p>Mr. Lopez divided his garden into equal parts for planting, as shown in the diagram below. The shaded part of the diagram shows where he planted carrots.&nbsp;</p>\n<p>&nbsp;<img src=\"http://media.powermylearning.org/content/assets/userpromptimages/131097063695123689_post.png\" width=\"149\" height=\"104\" /></p>\n<p>Which fraction of the garden is planted with carrots?</p>"

if we take <p> tag that wrapped around <img> tag out, image shows up. Is this is how PIE editor expects? Or something you need to fix?

elodszopos commented 6 years ago

@edeustace I traced the problem to the serialisation logic that we have defined and that is being called in the editable-html constructor.

const v = htmlToValue(props.markup); <- props.markup has the correct value, including the image tag
const mu = valueToHtml(v);

 if (mu !== props.markup) {
    props.onChange(mu); <- here value gets wiped, img tag disappears
 }

For some reason, if the tag is a child of another tag, serialisation process strips it from markup.

edeustace commented 6 years ago

@narayankj , this relates to the slatejs core serialization rules. We'd have to look at configuring another schema to suit you, but if you can work around it for now that would be useful.

narayankj commented 6 years ago

@edeustace In our data image can be anywhere like in Table, or ul-li etc. We may loose formatting(semantics in some cases) if we try to bring image out of these to root level. I am not sure if we have left with workaround.

edeustace commented 6 years ago

ok @narayankj - I'll see if we can update the schema

edeustace commented 6 years ago

I've been looking at this issue and I need to get some answers from the slate team about this, because my initial attempts to support your schema are not working.

edeustace commented 6 years ago

Fixed in @pie-lib/editable-html@6.2.5 - please do a fresh build.