Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-23646

TinyMCE can't be resized and doesn't scroll for wide content, especially on small screens

    XMLWordPrintable

    Details

    • Database:
      Any
    • Testing Instructions:
      Hide

      In Chrome/Safari, Firefox and IE:

      1. Configure tinyMCE settings, replacing one | with "wrap" for each toolbar row
      2. View a page with tinymce with the browser window > 480px wide
      3. Verify tinymce looks normal, and can be resized down to the width of the longest toolbar.
      4. View the same page on a browser window < 480px wide
      5. Verify the tinymce toolbar is broken into more rows (at the "wrap") point and the editor fits on the screen.
      6. Switch to a RTL language
      7. View the page again
      8. Verify the tinymce toolbar is broken into more rows (odd alignment is a known issue - needs discussion)

      Upgrade testing.

      1. Install a clean 2.6dev site from before this patch.
      2. Upgrade to the latest integration with this patch installed.
      3. Verify the tinymce toolbar settings include one wrap plugin for each toolbar.
      1. Install a clean 2.6dev site from before this patch.
      2. Customise the tinymce toolbars setting.
      3. Upgrade to the latest integration with this patch installed.
      4. Verify the tinymce toolbar settings includes one wrap plugin for each toolbar.
      Show
      In Chrome/Safari, Firefox and IE: Configure tinyMCE settings, replacing one | with "wrap" for each toolbar row View a page with tinymce with the browser window > 480px wide Verify tinymce looks normal, and can be resized down to the width of the longest toolbar. View the same page on a browser window < 480px wide Verify the tinymce toolbar is broken into more rows (at the "wrap") point and the editor fits on the screen. Switch to a RTL language View the page again Verify the tinymce toolbar is broken into more rows (odd alignment is a known issue - needs discussion) Upgrade testing. Install a clean 2.6dev site from before this patch. Upgrade to the latest integration with this patch installed. Verify the tinymce toolbar settings include one wrap plugin for each toolbar. Install a clean 2.6dev site from before this patch. Customise the tinymce toolbars setting. Upgrade to the latest integration with this patch installed. Verify the tinymce toolbar settings includes one wrap plugin for each toolbar.
    • Affected Branches:
      MOODLE_20_STABLE, MOODLE_22_STABLE, MOODLE_23_STABLE
    • Fixed Branches:
      MOODLE_26_STABLE
    • Pull from Repository:
    • Pull Master Branch:
      MDL-23646-master
    • Story Points:
      20
    • Sprint:
      FRONTEND Sprint 2

      Description

      When editing an HTML page in 2.0 on a Netbook (I think the one I saw was an eeePC) the screen is so small that the dragging handle of TinyMCE gets cut off and the whole thing is pretty well useless - see http://screencast.com/t/NmE1ODEwM for an example. No idea if this is something which is fixable by setting the default width of the editor based on the width of the browser, but thought I'd mention it anyway...

      Replication steps:

      1. Log in as admin
      2. Navigate to Site admin > Appearance > Site selector
      3. Choose a theme with blocks on the right, such as Binarus
      4. Navigate to a course
      5. Create a page resource
      6. Reduce the size of the browser window and note the effect on the HTML editor

      Expected result: The HTML editor resizes down before it is covered by blocks on the right.

      Actual result: The right edge of the HTML editor disappears under the blocks.

        Attachments

        1. no problems with standard theme.jpg
          18 kB
          Mauno Korpelainen
        2. screenshot-1.jpg
          60 kB
          Michael de Raadt
        3. tinyMCEwrap.png
          312 kB
          Adrian Greeve
        4. with_overflow_auto.jpg
          90 kB
          David Monllaó

          Issue Links

            Activity

              People

              Assignee:
              damyon Damyon Wiese
              Reporter:
              drex Mark Drechsler
              Peer reviewer:
              Jason Fowler
              Integrator:
              Marina Glancy
              Tester:
              Adrian Greeve
              Participants:
              Component watchers:
              Andrew Nicols, Jun Pataleta, Michael Hawkins, Shamim Rezaie, Simey Lameze, Bas Brands
              Votes:
              10 Vote for this issue
              Watchers:
              14 Start watching this issue

                Dates

                Created:
                Updated:
                Resolved:
                Fix Release Date:
                18/Nov/13