CKEditor 3.6.6.1
Media 7.x-2.0-unstable7+53-dev

The screenshot with comments attached - we can see what is the problem in the screenshot and it is broken markup in the text editor.

I've tried to debug the media/js/wysiwyg- media.js file and till the lines
190: // Insert placeholder markup into wysiwyg.
191: Drupal.wysiwyg.instances[this.instanceId].insert(markup);
everything seams ok and the "markup" is correct, but the inserted markup in the editor is not correct.

Problably this is not the issue to media module but to CKEditor module. But still - it affects insertion of the media in the CKEditor with the media module.

CommentFileSizeAuthor
ckeditor-internet-media-bug.jpg421.66 KBNor4a
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

gmclelland’s picture

gmclelland CreditAttribution: gmclelland commented

See those spans with a line-height? I believe those are due to a chrome bug. I wonder if that is messing with the markup?

Would be interested if you could test this with another browser like Firefox. Remove those spans first.

Here is what my markup looks like after I insert an image at the end of a paragraph. Note: I'm using the 3.x version of Tinymce
<p>Here is another paragraph.<img height="211" width="290" class="media-element file-quarter" typeof="foaf:Image" src="http://mysite:8082/sites/default/files/styles/quarter/public/events/young-reader.jpg?itok=DyIkxLW0" alt="Person Reading" title=""></p>

Here is what my markup looks like when I insert an image into a new paragraph.
<p><img height="292" width="290" class="media-element file-quarter" typeof="foaf:Image" src="http://mysite:8082/sites/default/files/styles/quarter/public/patch.jpg?itok=MKNCpLFv" alt="Patch" title=""></p>

I'm using the latest 2.x-devs of media and file_entity, wysiwyg modules.

Also, if you view the source of the inserted media markup in the wysiwyg, what do you get?

It should look something like:
<p>Here is another paragraph.[[{"fid":"1083","view_mode":"quarter","fields":{"format":"quarter","field_file_image_alt_text[und][0][value]":"Person Reading","field_file_image_title_text[und][0][value]":"","field_image_tags[und]":""},"type":"media","link_text":null,"attributes":{"height":211,"width":290,"class":"media-element file-quarter"}}]]</p>

I had a similar issue where something was messing up the media code #2028255: ckeditor styles break media module markup

Hope that helps

Nor4a’s picture

Nor4a CreditAttribution: Nor4a commented

Yes. It seams to be a Chrome bug, because I just tested on the Opera and IE10 - every seams to be fine.
But still - html markup is like this:

<span class="file media-element file-video-wysiwyg" data-file_info="%7B%22fid%22:%221357%22,%22view_mode%22:%22video_wysiwyg%22,%22type%22:%22media%22,%22link_text%22:%22Pinky%20-%20Cut%20The%20Check%20(Official%20Video)%22%7D">
<img title="video/youtube" class="file-icon" alt="" src="/modules/file/icons/video-x-generic.png" data-cke-saved-src="/modules/file/icons/video-x-generic.png"> <a href="http://youtube.com/watch?v=YWZc-8Bza9I" type="video/youtube; length=0" data-cke-saved-href="http://youtube.com/watch?v=YWZc-8Bza9I">Pinky - Cut The Check (Official Video)</a>
</span>

And of course for the correct html markup (when I switch off the editor) I see the markup like this:

[[{"fid":"1357","view_mode":"video_wysiwyg","type":"media","link_text":"Pinky - Cut The Check (Official Video)","attributes":{"class":"file media-element file-video-wysiwyg"}}]].

And in the Chrome I see this:

<img alt="" class="file-icon" src="/modules/file/icons/video-x-generic.png" style="line-height: 1.538em;" title="video/youtube" /><span style="line-height: 1.538em;"> </span><a href="http://youtube.com/watch?v=YWZc-8Bza9I" style="line-height: 1.538em;" type="video/youtube; length=0">Pinky - Cut The Check (Official Video)</a><strong>

What can be done with this "Chrome bug"?
Where to report it? :)

Dave Reid’s picture

Dave Reid
he/him
Primary language English
Location Nebraska USA
CreditAttribution: Dave Reid commented
Component: Media Internet » WYSIWYG integration
gmclelland’s picture

gmclelland CreditAttribution: gmclelland commented

@Nor4a I don't think your output looks right. I would try using wysiwyg-2.x-dev with TinyMCE 3.5.8 and see if that changes you output.

http://ckeditor.com/forums/CKEditor/ckeditor-4.01-inserting-span-element...

Chris Matthews’s picture

Chris Matthews CreditAttribution: Chris Matthews as a volunteer commented
Component: WYSIWYG integration » Code
Issue summary: View changes
Status: Active » Closed (outdated)

Closing this issue as outdated. However, if you think this issue is still important, please let us know and we will gladly re-open it for review.
sincerely,
- the Drupal Media Team