search

ckeditor / ckeditor4

The best enterprise-grade WYSIWYG editor. Fully customizable with countless features and plugins.
https://ckeditor.com/ckeditor-4
Other
5.79k stars 2.47k forks source link

"Table" plugin: Table Properties Headers/Alignment not aligned #5160

Closed BaltoDog closed 2 years ago

BaltoDog commented 2 years ago

Senza titolo

Type of report

Bug

Provide detailed reproduction steps (if any)

I have noticed a little bug in the "Table Properties" window when you click on a table in the editor and then select "Table Properties" using the "Table" ckeditor plugin: https://ckeditor.com/cke4/addon/table

Expected result

As you see the "Headers" and "Alignment" options are not aligned ("None and ""). This happens with Firefox, but I guess it would be the same with other browsers. Please see attached file.

Actual result

"Headers" and "Alignment" options should be aligned

Other details

sculpt0r commented 2 years ago

Hi @BaltoDog - could you provide FF version that is installed on your Windows 11? Also, could you tell if this is occurring for you in our docs: https://ckeditor.com/docs/ckeditor4/latest/examples/table.html or your own application? If it is your own application - could you provide the exact editor version (like 4.18.0)?

Right now I can't reproduce this issue on Windows 11 & FF 99.0 neither on Windows 10 & FF 99.0.1 and MacOS 12.2.1 & FF 99.0. 🤔

BaltoDog commented 2 years ago

Hello! @sculpt0r I am using FF 99.0.1 and Windows 11 as well.

To reproduce the issue, please go here: https://italia.totallympics.com/topic/25-test/?do=edit Login with Username: Test Password: test

Right click on any cell of the table and then click on "Table Properties" (last button).

Can you reproduce the issue there?

Thank you!

sculpt0r commented 2 years ago

Thank you @BaltoDog for further details, however:

Please remember that any third-party styles and environment setup, also editor config might have an impact on the final editor behavior. Please provide a valid sample with CKEditor and all used configuration options via one of those:

We are unable to tell whether it is a bug in the CKEditor or your implementation without such detailed information. For now, it looks like there is no issue in the latest CKEditor version.

BaltoDog commented 2 years ago

Thank you @BaltoDog for further details, however:

* I'm not able to receive CKEditor version: the `CKEDITOR.version` returns 'DEV'. However, in the license headers in `ckeditor.js` I found the 2021 year - but it is not enough. Could you provide to CKEditor version?

* I'm not familiar with the Italian language, but I finally landed at https://italia.totallympics.com/contact/ and there is nothing in table props that looks like a bug (despite the fact that the properties seems to not working 🤔 )
image 
* I'm unable to log in (the username requires `@` character)

* Could you tell me which theme you are using? The default one is https://ckeditor.com/cke4/addon/moono-lisa and it looks like you are using something different.

Please remember that any third-party styles and environment setup, also editor config might have an impact on the final editor behavior. Please provide a valid sample with CKEditor and all used configuration options via one of those:

* CodePen: https://codepen.io/karoldawidziuk/pen/LYzJvdx

* JSFiddle: https://jsfiddle.net/Kratek_95/nhwe5uLq

* JSBin: https://jsbin.com/gubepar/edit?html,js,output

* StackBlitz: https://stackblitz.com/edit/ckeditor4-bug-report

We are unable to tell whether it is a bug in the CKEditor or your implementation without such detailed information. For now, it looks like there is no issue in the latest CKEditor version.

Hello,

sorry, please try again to login with

Username: testtesttesttesttest@test.com Password: test

CKeditor version: 4.17.1 (the one provided with the forum's software) Please ignore the contact page, go in the link provided before where there is already a formatted table.

Thank you!

sculpt0r commented 2 years ago

@BaltoDog I'm able to reproduce the issue on your page, but until you provide all information requested in https://github.com/ckeditor/ckeditor4/issues/5160#issuecomment-1106197618 I can't confirm that the issue is CKEdtior itself.

I'm unable to reproduce the issue on 4.17.1 version. If you can't provide the reproduction steps I requested - that points me in the direction that there is an issue in your app - not the editor itself and I'll close this issue. Please extract the minimal version of your CKEditor (with config) as I requested above.

BaltoDog commented 2 years ago

@BaltoDog I'm able to reproduce the issue on your page, but until you provide all information requested in #5160 (comment) I can't confirm that the issue is CKEdtior itself.

I'm unable to reproduce the issue on 4.17.1 version. If you can't provide the reproduction steps I requested - that points me in the direction that there is an issue in your app - not the editor itself and I'll close this issue. Please extract the minimal version of your CKEditor (with config) as I requested above.

Hello,

unfortunately I am not an expert in these things and I don't know how to provide the additional information. Can you please help me to find out what you need?

Thank you!

sculpt0r commented 2 years ago

Let's try :)

Here is a sample codepen with CKEditor and table inside it: https://codepen.io/sculpt0r/pen/eYyoJjd Please notice I changed the skin so it matches the skin that you are using (my guess). Also, I used the 4.18.0 CKEditor version.

Could you fork it, adjust and share it here so we could observe the eventual bug?

BaltoDog commented 2 years ago

Let's try :)

Here is a sample codepen with CKEditor and table inside it: https://codepen.io/sculpt0r/pen/eYyoJjd Please notice I changed the skin so it matches the skin that you are using (my guess). Also, I used the 4.18.0 CKEditor version.

Could you fork it, adjust and share it here so we could observe the eventual bug?

Hello,

unfortunately I do not understand what I should do in that page. The only page where I can show you the problem is this one: https://italia.totallympics.com/topic/25-test/?do=edit

This forum is using a CMS named Invision Community, which is using CKEditor 4.18.0 (source: https://invisioncommunity.com/release-notes/, click on " 4.6.12 Released 04/05/2022"

I can not reproduce the issue on codepen because if I right click on the table I do not get the "Table Properties" button.

Thank you!

sculpt0r commented 2 years ago

I adjust the codepen so it contains proper skin (moono). I'm not familiar with this CMS - they might use some custom config options to create the editor or modify it beside the practices we are describing in our docs. You could just copy and paste them to the codepen. However, if you can't reproduce the issue with the standard options provided in our docs - that might be issue in the CMS.

Please - let me know if you are able to fill the codepen with options used by the CMS.

BaltoDog commented 2 years ago

I adjust the codepen so it contains proper skin (moono). I'm not familiar with this CMS - they might use some custom config options to create the editor or modify it beside the practices we are describing in our docs. You could just copy and paste them to the codepen. However, if you can't reproduce the issue with the standard options provided in our docs - that might be issue in the CMS.

Please - let me know if you are able to fill the codepen with options used by the CMS.

Hello,

my guess is the problem is caused by this plugin: https://ckeditor.com/cke4/addon/table

If I do not install this plugin on my website, I am not even able to get the "Table Properties" window. After I install this plugin, if I right click on any cell of the table I can open Table Properties, which work fine but just has this visual problem.

I don't think I can install this plugin in Codepen?

Thank you!

jacekbogdanski commented 2 years ago

@BaltoDog I've tested that issue on Windows 11 with the latest Firefox and provided codepen by @sculpt0r. I don't see any styling issues when using a dialog plugin, you can see that yourself on the attached screencast:

https://user-images.githubusercontent.com/10279586/165899213-912e5f27-d5ba-4f39-b34d-7f1d4dacb294.mov

my guess is the problem is caused by this plugin: https://ckeditor.com/cke4/addon/table (...) I don't think I can install this plugin in Codepen?

That's one of the standard CKEditor 4 plugins and it's available in the attached codepen (otherwise, you wouldn't be able to open dialog over a table). My only guess is that the styling issue comes from the website you are using and should be reported to the CMS owner.

For now, I'm closing this issue as it has been verified by 2 CKE4 developers. If you, after contacting CMS owner, still will believe that the issue is caused by CKEditor 4 and will be able to provide reproduction steps using isolated CKEditor 4 demo - please let us know so we can reopen this ticket.