jakiestfu / Medium.js

A tiny JavaScript library for making contenteditable beautiful (Like Medium's editor)
http://jakiestfu.github.io/Medium.js/
4.39k stars 404 forks source link

Browsers generate different html #153

Open cico88 opened 9 years ago

cico88 commented 9 years ago

In short, it doesn't work at all. It generates completely different results from Chrome, FF, IE. I tried many options, to restrict what tags I want, but it doesn't work at all. Examples:

Browser1: line1

line2

Browser2

line1


line2

Browser3

line1

line2

After 3 weeks fighting with various HTML WYSIWYG editors - it's waste of time.. don't bother guys...

nrkn commented 9 years ago

I feel your pain and have struggled endlessly throughout the years trying to find something that works, or even just kind of works, and please believe me when I say that medium.js is as close as you're going to get. contenteditable is just a mess - range selection is a mess - with that in mind, medium.js is best of breed for contenteditable and Tim Downy's rangy is best of breed for range selection. W3 and the browser vendors really need to sort this out, the lib authors are doing their best.

robertleeplummerjr commented 9 years ago

Can you clarify what actions you took to enter the html? What needs to happen is to intercept the events, and force the browser to obey by stopping the event and carrying out the inserting of html manually. This may sound like a lot, but if it was worked into the core, and we create unite tests, test in all major borwsers, it becomes very easy. I look forward to being able to have you say: "I love contenteditable... with medium.js".

On Thu, May 28, 2015 at 5:52 AM, Nik Coughlin notifications@github.com wrote:

I feel your pain and have struggled endlessly throughout the years trying to find something that works, or even just kind of works, and please believe me when I say that medium.js is as close as you're going to get. contenteditable is just a mess - range selection is a mess - with that in mind, medium.js is best of breed for contenteditable and Tim Downy's rangy is best of breed for range selection. W3 and the browser vendors really need to sort this out, the lib authors are doing their best.

— Reply to this email directly or view it on GitHub https://github.com/jakiestfu/Medium.js/issues/153#issuecomment-106252974 .

Robert Plummer

cico88 commented 9 years ago

I need the same html code results from all browsers, contenteditable mess up everything, it's totally out of control. DIV/P/BR chaos, plus Shift+Enter doesn't work well too. Also, I wanted to restrict shortcuts (Ctrl+B/I/U). I don't understand why contenteditable does not allow us to have full control over the inner html, it adds extra stupid tags :) I was about to create own editor, take control over contenteditable inner html, update it on keypress and other events to keep it clear, just to keep cursor position... but I think it's waste of time. I ended up with markdown style editor, it's bit techy for clients, which I didn't want initially, but still better then any other wysiwyg editor nowadays. In short: wysiwyg sucks. It's like, I type "A" and browser shows "B"...

What You See Is What You Don't Get :)

robertleeplummerjr commented 9 years ago

I believe medium.js handles all of the use cases you are talking about. In fact, you can run the unit tests in your browser: http://jakiestfu.github.io/Medium.js/test/

On Thu, May 28, 2015 at 8:14 AM, cico88 notifications@github.com wrote:

I need the same html code results from all browsers, contenteditable mess up everything, it's totally out of control. DIV/P/BR chaos, plus Shift+Enter doesn't work well too. Also, I wanted to restrict shortcuts (Ctrl+B/I/U). I don't understand why contenteditable does not allow us to have full control over the inner html, it adds extra stupid tags :) I was about to create own editor, take control over contenteditable inner html, update it on keypress and other events to keep it clear, just to keep cursor position... but I think it's waste of time. I ended up with markdown style editor, it's bit techy for clients, which I didn't want initially, but still better then any other wysiwyg editor nowadays. In short: wysiwyg sucks. It's like, I type "A" and browser shows "B"...

What You See Is What You Don't Get :)

— Reply to this email directly or view it on GitHub https://github.com/jakiestfu/Medium.js/issues/153#issuecomment-106292834 .

Robert Plummer

cico88 commented 9 years ago

I don't know, it simply does not work for me, http://jakiestfu.github.io/Medium.js/docs/ - Rich - type: line1 (Shift+Enter) line2 (Shift+Enter) line3 (Shift+Enter)

tried in Chrome, FF, strange behaviour

robertleeplummerjr commented 9 years ago

Which of the editor instances are you using?

On Thu, May 28, 2015 at 8:34 AM, cico88 notifications@github.com wrote:

I don't know, it simply does not work for me, http://jakiestfu.github.io/Medium.js/docs/ - Rich - type: line1 (Shift+Enter) line2 (Shift+Enter) line3 (Shift+Enter)

tried in Chrome, FF, strange behaviour

— Reply to this email directly or view it on GitHub https://github.com/jakiestfu/Medium.js/issues/153#issuecomment-106296190 .

Robert Plummer

cico88 commented 9 years ago

Rich, when I use Rich with Insert Html, it adds DIV in Chrome, but not in FF. Live preview of actual html code below editor would be fine, to see what it actually does in demo.

robertleeplummerjr commented 9 years ago

Very cool idea! I will take a look today if I get time.

On Thu, May 28, 2015 at 8:53 AM, cico88 notifications@github.com wrote:

Rich, when I use Rich with Insert Html, it adds DIV in Chrome, but not in FF. Live preview of actual html code below editor would be fine, to see what it actually does in demo.

— Reply to this email directly or view it on GitHub https://github.com/jakiestfu/Medium.js/issues/153#issuecomment-106300458 .

Robert Plummer

bearded-avenger commented 9 years ago

@cico88 I agree with @nrkn , I've tried all existing solutions, and medium.js is as close as it gets. And it does work, as I've incorporated it into a front-end editor that I've built for WordPress. Unfortunately, there are a few existing issues with medium.js, which I would love to see patched for the benefit of everyone.

I would personally sponsor development time to help this project along.

robertleeplummerjr commented 9 years ago

I didn't set out to become the best editor out there, nor would I say we have achieved that, I simply took a look at others feeble attempts, and html5 execCommand method, which is stupid, rolled my eyes, pulled up my sleeves, and set out for a proper abstraction to solve these issues, extending Jake's already stellar vision. Let's identify the biggest 10 challenges, assemble a team of at least 4, and let's execute in terms of importance and least difficulty, and solve in that order.

My schedule is, like everyone else's, ridiculously tight, but this project is important. I would like to serve as a technical lead, finding simple ways to solve the biggest issues.

Before we execute, let's find at least two financial backers, we might already have one, any takers?

Those who would like to help solve, please do so, track your hours, and we will try and find financing that works. On Jun 28, 2015 10:16 AM, "Nick Haskins" notifications@github.com wrote:

@cico88 https://github.com/cico88 I agree with @nrkn https://github.com/nrkn , I've tried all existing solutions, and medium.js is as close as it gets. And it does work, as I've incorporated it into a front-end editor that I've built for WordPress. Unfortunately, there are a few existing issues with medium.js, which I would love to see patched for the benefit of everyone.

I would personally sponsor development time to help this project along.

— Reply to this email directly or view it on GitHub https://github.com/jakiestfu/Medium.js/issues/153#issuecomment-116285886 .

nokome commented 9 years ago

@robertleeplummerjr, I like the sound of your plan! I can provide some financial backing; my preference would be to do that through Bountysource as I have done in the past. Pointed in the right direction, I might be able to provide some development manpower too.

bearded-avenger commented 9 years ago

Excellent! As I mentioned above, I'd be happy to provide some financial backing for this. Should we create a new label to track any issues that are going to be fixed as a collective, and perhaps a milestone with an arbitrary date to keep us in pace?

robertleeplummerjr commented 9 years ago

If you could go through the issues, and give them a "+1", that'd be awesome, then we could see from your perspective what is important, and naturally the ones with the most +1's are the higher priority.

On Tue, Jun 30, 2015 at 12:45 PM, Nick Haskins notifications@github.com wrote:

Excellent! As I mentioned above, I'd be happy to provide financial backing for this. Should we create a new label to track any issues that are going to be fixed as a collective, and perhaps a milestone with an arbitrary date to keep us in pace?

— Reply to this email directly or view it on GitHub https://github.com/jakiestfu/Medium.js/issues/153#issuecomment-117250965 .

Robert Plummer

nokome commented 9 years ago

Agree with the suggestion for a custom label and a milestone (2.1?) to attach those issues to. At this stage, I'm happy to be guided by others on what the priorities should be. Seems that @bearded-avenger has had the experience using medium.js in production to make him well placed to provide that guidance.

robertleeplummerjr commented 9 years ago

https://github.com/jakiestfu/Medium.js/milestones/2.0%20Enterprise%20Ready%20Release

nokome commented 9 years ago

Is there still an appetite to do sprint along the lines of what we discussed above?

robertleeplummerjr commented 9 years ago

There is, there are just limitations on my time right now. Could we possibly a few bounty's on the important issues? Some of them would take 20 or so hours to resolve, create a unit test for, and to test and further debug. Would you consider a larger bounty to attract interest?

On Sun, Aug 9, 2015 at 6:28 PM, Nokome Bentley notifications@github.com wrote:

Is there still an appetite to do sprint along the lines of what we discussed above?

— Reply to this email directly or view it on GitHub https://github.com/jakiestfu/Medium.js/issues/153#issuecomment-129256963 .

Robert Plummer

nokome commented 9 years ago

Sure, completely understand; I have no time available right now either. Just wanting to touch base to see if this might still be a possibility some time in the next 6 months or so.

I haven't done enough testing of Medium.js yet to know what the real pain points are. Once I have a better feel for that I will have a better feel for how much funding I could contribute to see those resolved. I'll come back here when I am more ready to do that.