This is un-good, since I can't tell what I'm about to edit:

I can see something's editable, but can't see where I'm going to edit once I start typing

CommentFileSizeAuthor
#17 in-place-cursor-1893638-17.patch1.63 KBdevin carlson
Screen Shot 2013-01-20 at 12.06.51 AM.png16.55 KBwebchick

Comments

nod_’s picture

nod_
Primary language French
Location Lille
commented

So If I mess around the CSS rules applied to the element I can get the cursor to show up but I can't seem to make it show up without any messing around firebug. Will see if ckeditor guys have an idea about that.

nod_’s picture

nod_
Primary language French
Location Lille
commented

On CKEditor guys' advice toggling the contenteditable mode makes the cursor show up on FF. Still not working on chrome though.

This is probably an issue that needs solving upstream in createjs.

nod_’s picture

nod_
Primary language French
Location Lille
commented

(dup)

wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented

How can Create.js "fix" this? It's plain contentEditable, nothing more, nothing less.

Can you reproduce the problem if you don't go into Edit mode, but manually set the contentEditable attribute on the title? If you can't reproduce it that way, it might be (somehow) triggered by Edit's CSS or JS…

nod_’s picture

nod_
Primary language French
Location Lille
commented

It's browser bug territory, default implementation should take care of it so that we don't have to do this kind of things in our code: http://drupalcode.org/project/edit.git/commitdiff/ce7d08a886bafef96cbdf9...

wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented

#5: possibly, but are you certain it's not a side-effect of some of Edit's CSS or JS? The simple test in #4 would assert that.

nod_’s picture

nod_
Primary language French
Location Lille
commented

If I set it from the console it works fine just setting the thing. But it doesn't work when used in edit JS. So yes it's a side effect but I don't know where from and how else to fix it.

I can't rely on firebug being open because that works when I mess around with it anyway.

wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented

Then you can do other tests to narrow it down! One by one, disable these:
- Edit's CSS
- PropertyEditorDecorationView's (un)padding
- ToolbarView's (un)padding

webchick’s picture

webchick
she/they
Primary language English
Location Vancouver 🇨🇦
commented
Title: Cursor doesn't show up in direct text edit mode » Cursor doesn't show up in direct text edit mode on node titles

Amending this. It does show up fine in a plain text field direct edit mode, it's only node titles that it fails on. Bizarre.

In other words, working:

<div class="field-items"><div id="edit-toolbar-for-node_1_every_field_text_und_full" class="edit-toolbar-container edit-animate-only-visibility edit-editing">  <div class="edit-toolbar-heightfaker edit-animate-fast" style="bottom: 6px; left: -5px; ">    <div class="edit-toolbar primary"><div class="edit-toolgroup edit-animate-slow edit-animate-delay-veryfast info edit-animate-only-background-and-padding"><button type="button" class="blank-button label">Text</button></div><div class="edit-toolgroup edit-animate-slow edit-animate-delay-veryfast ops"><button type="submit" class="field-save save gray-button">Save</button><button type="button" class="field-close close gray-button"><span class="close">Close</span></button></div></div>  </div></div><div class="field-item even edit-animate-fast edit-candidate edit-editable edit-highlighted edit-editing" style="background-color: rgb(255, 255, 255); width: 731px; top: -5px; left: -5px; padding: 5px; margin-bottom: -10px; " tabindex="0" role="button" contenteditable="true">A text field. I have a nice lovely cursor!</div></div>

Not working:

<h1 class="title" id="page-title">
          <span data-edit-id="node/1/title/und/full" class="edit-allowed edit-field edit-type-direct edit-app-click-prevent-processed" data-edit-field-label="Title" aria-label="Entity node 1, field Title"><span class="field-item edit-animate-fast edit-candidate edit-editable edit-highlighted edit-editing" style="background-color: rgb(255, 255, 255); width: 236px; top: -5px; left: -5px; padding: 5px; margin-bottom: -10px; " tabindex="0" role="button" contenteditable="true">Welcome to Spark!</span></span>        </h1>

The only thing that stands out to me (other than we clearly need a few more dozen classes) is the aria roles that are present on node title but not on the text field. Not sure if that's related though.

webchick’s picture

webchick
she/they
Primary language English
Location Vancouver 🇨🇦
commented
Status: Active » Fixed

For whatever reason this is working for me now. YAY! :D

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented
Status: Closed (fixed) » Active
Issue tags: +Spark

Not working here. Note that with or without this hack, it works if you give focus to another app, then go back to Firefox. Tested on OS X 10.7.4, Firefox 19.0.2.

Since this hack is not at all reliable, reverting: http://drupalcode.org/project/edit.git/commit/e42d7d6

wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented
Title: Cursor doesn't show up in direct text edit mode on node titles » [Firefox bug] Cursor doesn't show up when using the "direct" PropertyEditor widget on node titles
Status: Active » Postponed
Issue tags: +sprint

Unclear how we can solve this.

wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented
Issue tags: -sprint
wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented
Title: [Firefox bug] Cursor doesn't show up when using the "direct" PropertyEditor widget on node titles » [Firefox bug] Cursor doesn't show up when using the "direct" or "ckeditor" PropertyEditor widgets

I just spent a bit of time on this again. http://ckeditor.com/demo#inline works fine in Firefox. But CKEditor as used in Edit does not (I can reproduce the problem there too now). Open the developer tools, click somewhere in there, then go back to the field. Now the cursor *does* appear.

I really think this is a bug in Firefox, possibly something with timing, where the consequences of dynamically setting contentEditable=true need to be parsed & rendered by Firefox *before* doing something else. Narrowing this down to the very specific timing problem is a very tricky and time consuming task though.

wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented
Project: Edit » Quick Edit
Issue summary: View changes
Related issues: +#2154775: In-place editing of title: works, but cursor is invisible

This was "kind of" fixed in D8 over at #2154775: In-place editing of title: works, but cursor is invisible.

devin carlson’s picture

devin carlson commented
Status: Postponed » Needs review
StatusFileSize
new in-place-cursor-1893638-17.patch1.63 KB

A backport of #2154775-31: In-place editing of title: works, but cursor is invisible.

devin carlson’s picture

devin carlson commented
Status: Needs review » Fixed

Manually tested #17 with Firefox to confirm that the cursor is displayed. Also tested in Chrome, Safari and IE to verify that they continued to work properly.

Committed to Quick Edit 7.x-1.x.

  • Devin Carlson committed acd4c34 on 7.x-1.x 
    Issue #1893638 by Devin Carlson: Fixed In-place editing of title: works...
wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented

Woot! Thanks Devin :)

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.