Uploaded image for project: 'Sakai'
  1. Sakai
  2. SAK-40006

Certain input causes full screen CKEditor to hide toolbar

    Details

    • Type: Bug
    • Status: RESOLVED
    • Priority: Minor
    • Resolution: Fixed
    • Affects Version/s: 12.2, 19.0
    • Fix Version/s: 19.0
    • Labels:
      None
    • Environment:
      Firefox 59 and 60
    • Test Plan:
      Hide

      In Firefox (Tested on 59.02 and 60.0) - Reported to also be an issue with some versions of IE. Not an issue in Chrome

       

      • Create a site
      • Go to Site Info -> Edit Site Information
      • Click the "Source" button on CKEditor for description, add this source code on the bottom
      • Click Source again, click the full screen button.

      Expected: The toolbar appears and everything works as expected
      Actual: The toolbar disappears in this test case

      This is possibly related to the Enhanced Image plugin?

      Note: The image is a broken link it doesn't actually work, and the description value is really long. I don't know what combination is causing this to break. Changing the image to working link usually seems to work but has broken it. Making the description value shorter also makes it work fine.
       

      <p style="text-align:center"><img alt="" height="456" src="/library/image/nosakai.jpg" width="800" /></p>
      
      <p><strong>Description:</strong> <em>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas ut orci quis ex convallis laoreet. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean hendrerit lobortis tortor ut commodo. Vivamus ut dolor vitae turpis dapibus facilisis. Maecenas tristique interdum tellus, vitae bibendum massa tincidunt at. Phasellus eu dui eget nisi porta hendrerit nec bibendum magna. Maecenas vel ullamcorper metus, nec laoreet nibh. Nulla facilisi.</em></p>
      
      Show
      In Firefox (Tested on 59.02 and 60.0) - Reported to also be an issue with some versions of IE. Not an issue in Chrome   Create a site Go to Site Info -> Edit Site Information Click the "Source" button on CKEditor for description, add this source code on the bottom Click Source again, click the full screen button. Expected: The toolbar appears and everything works as expected Actual: The toolbar disappears in this test case This is possibly related to the Enhanced Image plugin? Note: The image is a broken link it doesn't actually work, and the description value is really long. I don't know what combination is causing this to break. Changing the image to working link usually seems to work but has broken it. Making the description value shorter also makes it work fine.   <p style="text-align:center"><img alt="" height="456" src="/library/image/nosakai.jpg" width="800" /></p> <p><strong>Description:</strong> <em>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas ut orci quis ex convallis laoreet. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean hendrerit lobortis tortor ut commodo. Vivamus ut dolor vitae turpis dapibus facilisis. Maecenas tristique interdum tellus, vitae bibendum massa tincidunt at. Phasellus eu dui eget nisi porta hendrerit nec bibendum magna. Maecenas vel ullamcorper metus, nec laoreet nibh. Nulla facilisi.</em></p>

      Description

      One of our clients found a certain combination of HTML when used in the CKEditor causes the toolbar to disappear when entering full screen mode. This seems to only be an issue with Firefox and IE and some HTML. See test plan for an example.

      I researched and found this issue and this css that seems to fix the issue.
      https://www.drupal.org/project/ckeditor/issues/1043230#comment-12297701

      I'm not 100% sure why this fixes it but looks like it does.

      .cke_inner.cke_reset.cke_maximized {
          position: fixed !important;
      }
      

        Gliffy Diagrams

          Attachments

            Activity

              People

              • Assignee:
                jonespm Matthew Jones
                Reporter:
                jonespm Matthew Jones
              • Votes:
                0 Vote for this issue
                Watchers:
                1 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Git Source Code