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

Make pasting images into the Atto HTML editor work (as much as browsers will let us)

XMLWordPrintable

    • MOODLE_27_STABLE, MOODLE_39_STABLE
    • MOODLE_39_STABLE
    • Hide

      This should be tested on all supported browsers, on all supported Operating systems, as far as relevant (e.g. you can't drag in image file on a mobile browser).

      So far I have tested Firefox, Chrome and Edge on Windows, which all seem to work.

      Before you start you need some image files (sample one attached).

      Test drag drop of one image

      1. Go to anywhere in Moodle that supports atto with a filepicker (e.g. start writing a forum post).
      2. Drag in the image file. (This was working before, but the code changed while impelementing this feature, so we are testing that there is no regression.)
      3. Verify that you see the progress indicator while the file uploads, and then the image appears.
      4. Click the View source button ( <> ).
      5. Verify that this the image has a URL including 'draftfile.php'.

      Test drag drop of multiple images

      (This did not work before, but it does now )

      1. Select several image files on your computer, and drag them into the editor.
      2. Verify that you multiple progress spinners, one for each image, and then all the images appear.
      3. Select some image files, and some non-image files on your computer, and drag them into the editor.
      4. Verify that the images get uploaded, and the other files get ignored.

      Test pasting images

      This is what you have been waiting for!

      1. Open the image in some program where you can copy it. E.g. open it in your Operating system's photo viewer, and copy the image to the clipboard, or take a screen-grab onto the clipboard.
      2. Paste into Atto.
      3. Verify that you see the progress indicator while the file uploads, and then the image appears.
      4. Click the View source button ( <> ).
      5. Verify that this the image has a URL including 'draftfile.php'.
      Show
      This should be tested on all supported browsers, on all supported Operating systems, as far as relevant (e.g. you can't drag in image file on a mobile browser). So far I have tested Firefox, Chrome and Edge on Windows, which all seem to work. Before you start you need some image files (sample one attached). Test drag drop of one image Go to anywhere in Moodle that supports atto with a filepicker (e.g. start writing a forum post). Drag in the image file. (This was working before, but the code changed while impelementing this feature, so we are testing that there is no regression.) Verify that you see the progress indicator while the file uploads, and then the image appears. Click the View source button ( <> ). Verify that this the image has a URL including 'draftfile.php'. Test drag drop of multiple images (This did not work before, but it does now ) Select several image files on your computer, and drag them into the editor. Verify that you multiple progress spinners, one for each image, and then all the images appear. Select some image files, and some non-image files on your computer, and drag them into the editor. Verify that the images get uploaded, and the other files get ignored. Test pasting images This is what you have been waiting for! Open the image in some program where you can copy it. E.g. open it in your Operating system's photo viewer, and copy the image to the clipboard, or take a screen-grab onto the clipboard. Paste into Atto. Verify that you see the progress indicator while the file uploads, and then the image appears. Click the View source button ( <> ). Verify that this the image has a URL including 'draftfile.php'.

      Google Docs, GMail and some other mail clients have started allowing users to copy images from a desktop program (paint / powerpoint / word / gimp / fireworks etc...) and paste them directly into the text editor without having to manually save the file and upload it. The same feature would be really useful in moodle.

      Use case:
      User copies an image into their clipboard
      User writes some text into the text editor (e.g. label / web page) in moodle and presses Ctrl + V to paste the image.
      The image should upload to the personal files area and be inserted into the text editor.

            Votes:
            22 Vote for this issue
            Watchers:
            40 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - Not Specified
                Not Specified
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 5 hours, 30 minutes
                5h 30m

                  Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.