Safari / CkEditor deleting content

[adrianbj]

Short description of the issue

Safari will delete the rest of the fields content when an image is placed at the very top.

I've seen this on two different sites and two different computers.

Optional: Screenshots/Links that demonstrate the issue

Your screenshots/links go here.

Steps to reproduce the issue

1. Using Safari, create content in a CkEditor field with an image before any other content. When inserting you must check the "caption" checkbox so that PW will wrap it in a

   tag. Now add some text below the image.

2. Save the page.

3. Now, select that image and click the Image button the CkEditor toolbar (or right click on it and select image properties). You can make a change if you want, but even clicking "Insert Image" without changes will work. Do that, and you'll see that all content below the image is gone.

If you add a sentence before the image, you'll see that the problem no longer exists.

I'm not sure yet if this is a PW bug, or a CkEditor bug.

Setup/Environment

• ProcessWire version: 3.0.172

[ryancramerdesign]

@adrianbj Testing in Safari 14.0.3 and current PW dev branch, I can't duplicate it here. It's possible it was a CKE bug, as the CKE version was updated a couple weeks ago. Though let me know if you are still seeing it.

[adrianbj]

@ryancramerdesign - thanks for checking, but unfortunately I can still reproduce it if I follow my instructions above using the very latest PW dev version.

[adrianbj]

I don't think there is anything special in here, but just in case:

{
    "body": {
        "id": 76,
        "name": "body",
        "label": "Body",
        "flags": 32768,
        "type": "FieldtypeTextarea",
        "inputfieldClass": "InputfieldCKEditor",
        "rows": 10,
        "contentType": 1,
        "toolbar": "Format, Styles, -, Bold, Italic, Superscript, Subscript, -, RemoveFormat\nNumberedList, BulletedList, -, Blockquote\nJustifyBlock, JustifyCenter, JustifyLeft, JustifyRight\nPWLink, Unlink, Anchor\nPWImage, Table, HorizontalRule, SpecialChar\nPasteText, PasteFromWord\nScayt, -, Sourcedialog",
        "inlineMode": 0,
        "useACF": 1,
        "usePurifier": 1,
        "formatTags": "p;h1;h2;h3;h4;h5;h6;pre;address",
        "removePlugins": "image,magicline",
        "toggles": [
            2,
            4,
            8
        ],
        "qtyMin": 1,
        "qtyMax": 10,
        "trashable": 1,
        "size": 0,
        "maxlength": 2048,
        "inputfieldConfigNames": "rows,toolbar,inlineMode,useACF,usePurifier,toggles,formatTags,extraAllowedContent,contentsCss,contentsInlineCss,stylesSet,extraPlugins,plugin_sourcedialog,removePlugins",
        "schemaClass": "FieldtypeTextarea",
        "pageLinkAbstractor": 2,
        "sortable": 1,
        "collapsed": 0,
        "minlength": 0,
        "showCount": 0,
        "extraPlugins": [
            "pwimage",
            "pwlink",
            "sourcedialog"
        ],
        "textformatters": [
            "TextformatterVideoEmbed",
            "TextformatterVideoEmbedOptions",
            "TextformatterHannaCode"
        ],
        "htmlOptions": [
            2,
            4
        ],
        "contentsCss": "/site/modules/InputfieldCKEditor/contents.css",
        "tags": "",
        "showIf": "",
        "themeOffset": "",
        "themeBorder": "",
        "themeColor": "",
        "columnWidth": 100,
        "required": "",
        "requiredAttr": "",
        "requiredIf": "",
        "imageFields": "",
        "extraAllowedContent": "",
        "contentsInlineCss": "",
        "stylesSet": "",
        "customOptions": "",
        "plugin_sourcedialog": ""
    }
}

[Soren1612]

I can confirm this problem with:

PW 3.0.165
CK Editor 4.14.0
Safari 11.1.2

[adrianbj]

Thanks @Soren1612.

@ryancramerdesign - just so you know, I am on Safari 13.1.2 and my client who discovered the issue in the first place is on 14.1 so it doesn't seem like it is related to the version of Safari and I am on the latest dev version of PW so it doesn't seem to be related to the version of CkEditor either.

[Krlos740]

Hi, I can confirm this issue using the steps to reproduce.

PW: 3.0.165

CK Editor: 4.14.0

Safari: 14.1

[adrianbj]

Thanks @Krlos740 - I guess the key thing now is to see if someone else running the latest PW dev can also reproduce it so we can confirm it wasn't fixed in the CkEditor upgrade that @ryancramerdesign included recently.

[Krlos740]

@adrianbj I have updated one of my dev sites and I can confirm I can duplicate the issue:

PW: 3.0.177

CK Editor: 4.16.0

Safari: 14.1

I have also tested same site on Edge 90.0.818.56 and it's not happening there.

Also it's not happening on Firefox 88.0.1

[adrianbj]

Thank you @Krlos740 - really appreciate you taking the time to confirm this.

[ryancramerdesign]

@adrianbj I'm back to trying to duplicate this one again, but still can't. Safari Version 14.1.2 (14611.3.10.1.5) / OS X. Can you think of anything specific that might be necessary to reproduce it? For instance, is your /site/modules/InputfieldCKEditor/contents.css a custom one?

[adrianbj]

Hi @ryancramerdesign - I don't have /site/modules/InputfieldCKEditor/contents.css enabled via the Custom Editor CSS File setting.

I am on Safari 13.1.2, but @Krlos740 confirmed the issue on 14.1, so I don't think that's related.

I am curious if you tried a CkEditor field with the settings I posted above?

Please note that I am still seeing this CkEditor 4.16.0

I just checked the developer toolbar and I'm not seeing any JS errors.

Sorry, I don't know what else to look for at this point but with both @Krlos740 and @Soren1612 confirming it, there must be something there. Also, just an FYI that I turned off AdminOnSteroids just to make sure that wasn't the culprit.

[ryancramerdesign]

@adrianbj I was finally able to duplicate this one on a different installation. It turns out that Safari apparently has a long running bug related to programmatic selection, and so the only way around it is to detect it and code around it specific to Safari. I've done that and have been able to fix it on this installation I was observing the issue with. Hopefully this fixes it for you too, but please let me know if not.