danielearwicker / carota

Simple, flexible rich text rendering/editing on HTML Canvas
Other
732 stars 145 forks source link

Exception when entering first character #30

Closed danrzeppa closed 9 years ago

danrzeppa commented 9 years ago

I pulled from master and attempted to trim down your sample to the most basic. Here's what I ended up with:

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <script src="carota-debug.js"></script>
  <style>
    #exampleEditor {
      border: 1px solid silver;
      position: absolute;
      left: 10px;
      top: 40px;
      right: 50%;
      bottom: 40px;
    }
  </style>
</head>
<body>
<div id="exampleEditor"></div>
<script>
  window.onload = function() {
    var elem = document.querySelector('#exampleEditor')
    var exampleEditor = carota.editor.create(elem)
  }
</script>
</body>
</html>

If you focus the editor and press a key on the keyboard, an exception is thrown.

Uncaught TypeError: Object prototype may only be an Object or null: undefined 
node.derive.splice    (at carota-debug.js:656 )
Range.setText         (at carota-debug.js:2149)
node.derive.insert    (at carota-debug.js:536)
(anonymous function)  (at carota-debug.js:1256)
(anonymous function)  (at carota-debug.js:902)

If the editor is pre-loaded with some text, like:

exampleEditor.load(carota.html.parse("<div><p>Test</p></div>"))

immediately after the carota.editor.create, you are able to position the caret and type without issue. If, however, you select all the characters using ctrl+a, then delete them, then attempt to type again it will throw the exception.

You are able to use the backspace key to remove all the characters, and then enter a new character without it throwing the exception. But placing the caret at the very beginning, and deleting all the characters with the delete key, then pressing the delete key one more time, presumably deleting the linefeed, will cause the exception to be thrown the next time a key is pressed.

Looking through the code it appears that some changes where made somewhat recently to the area from where the exception is thrown. The code in Github appears to be newer than the code that is running on your sample site (http://earwicker.com/carota/) which works.

danielearwicker commented 9 years ago

Fixed - and thanks for alerting me to how far behind the demo site was. It didn't have the fix for blury canvas on retina displays so it looked terrible on new-ish Macs.