Freecodecamp: Der Cursor springt zufällig im Code-Editor.

Erstellt am 1. Apr. 2016  ·  66Kommentare  ·  Quelle: freeCodeCamp/freeCodeCamp

In allen Übungen müssen wir Benutzer die Eingabetaste drücken, bevor wir Code schreiben.


Aktualisieren:

Wir haben die Konversation in diesem Thread vorübergehend nur für Mitarbeiter gesperrt. Dies wurde in der Bereitstellung behoben und wird bald live sein.

Das Update kann auf der Beta-Website bestätigt werden.

Die Problemumgehung, die derzeit auf der Produktionswebsite angezeigt wird, lautet:
Drücken Sie die Eingabetaste im Herausforderungseditor und fahren Sie mit der Herausforderung fort.

Entschuldigung für die Unannehmlichkeiten in der Zwischenzeit.

Erreichen Sie uns im Chatraum, wenn Sie Hilfe benötigen.

resolveshipping bug

Hilfreichster Kommentar

@ sadathanwar17 @bugron Dieser Fehler scheint immer noch aktiv zu sein. Ich kann es hier reproduzieren https://www.freecodecamp.com/challenges/create-a-text-field.

  • Chrome 50.0.2661.102
  • Macintosh OS X 10.11.2
  • Browsergröße 1680 x 952
  • Bildschirmauflösung 1680 x 1050

cursor-bug

Alle 66 Kommentare

Ich konnte das nicht reproduzieren.

Könnten Sie weitere Informationen zu Ihrem Gerät / Browser bereitstellen? Ich kann innerhalb des Editors tippen, sobald eine Herausforderung geladen wird, wobei der Editor automatisch den Fokus übernimmt, ohne die Eingabetaste drücken zu müssen.

Dies kann ein spezifisches Problem für Ihr Setup sein.

Ich glaube, ich habe das gleiche Problem mit dem Herausgeber.

In dieser Übung (siehe Abbildung unten) kann ich beispielsweise einige Teile des Codes nicht fokussieren, bevor ich die Eingabetaste drücke (weder mit der Maus noch mit der Tastatur). Egal, wo ich unter Zeile 54 klicke, der Cursor springt direkt zum Anfang von Zeile 54. Nachdem Sie irgendwo im Code einmal auf "Enter" geklickt haben, funktioniert alles einwandfrei!

Ich verwende die neueste Version von Chrome unter Windows 10. Ich habe dieses Problem in den meisten Übungen bisher bemerkt.

image

Ich habe das gleiche Problem wie smlabt, egal welche Übung ich mache. Ich verwende Firefox unter Windows 10.

Zeile 56 Eingabe> würde das funktionieren

Wenn Sie dieses Problem haben, geben Sie bitte Ihren Browser, Ihr Betriebssystem und Ihre Herausforderung an, auf der Sie dies zum ersten Mal erlebt haben. Wenn möglich, wäre ein Video eines GIF des Problems äußerst hilfreich. Ohne diese Informationen kann das Problem nicht behoben werden.

Wie gesagt, ich verwende Chrome unter Windows 10.
Bitte versuchen Sie, das Problem mit einem kleineren Fenster zu reproduzieren. Ich kann mir vorstellen, dass dieses Verhalten durch die Zeilenumbrüche verursacht worden sein könnte.
Ich werde versuchen, so schnell wie möglich ein GIF zu erstellen.

@smlabt Mach dir keine Sorgen über das

Bei einigen Aufgaben bewegt sich der Cursor nicht bis zur letzten Zeile, er hört vor 3-5 Zeilen darüber auf zu sinken, daher musste ich oben Platz schaffen, um ihn abzuschließen. (Trat hauptsächlich bei HTML-CSS-Aufgaben auf.)
Mein Benutzeragent ist Mozilla / 5.0 (Windows NT 6.3; WOW64) AppleWebKit / 537.36 (KHTML, wie Gecko) Chrome / 49.0.2623.112 Safari / 537.36 @BKinahan

Dies zum ersten Mal zu verwenden und dieses Usability-Problem ist das erste, was mir aufgefallen ist. Dies gilt für alle Herausforderungen, die ich bisher im Javascript-Pfad ausprobiert habe. Die einzige Möglichkeit, zum Codefenster zu gelangen, besteht darin, darauf zu klicken. Dies gilt auch für das Scrollen im Anweisungsfenster.

Mozilla / 5.0 (Macintosh; Intel Mac OS X 10_9_5) AppleWebKit / 537.36 (KHTML, wie Gecko) Chrome / 49.0.2623.112 Safari / 537.36

Ich habe gerade angefangen, im Code Free Camp das Codieren zu lernen. Als ich buchstäblich gerade erst angefangen habe, bin ich ein bisschen besorgt, meine Hilfe bei der Diagnose des Problems anzubieten.

Was ich anbieten kann, ist meine Erfahrung. Jedes Mal, wenn ich eine Seite lade, klicke ich auf das Codefenster und versuche, an der angeklickten Stelle zu tippen.
Der tatsächliche Ort, an dem es tippt, ist unten (scheinbar zufällig) ein kurzes Stück von der Stelle entfernt, an der ich ursprünglich geklickt habe.

Der Cursor konnte nur dann nicht nach unten springen, wenn ich im Editor auf die erste Zeile geklickt habe. Diejenige, bei der es beginnt, wenn die Seite geladen wird.

(bearbeiten)
Ich wollte auch hinzufügen. Das Problem schien ab " https://www.freecodecamp.com/challenges/create-a-bootstrap-headline " kein Problem mehr zu sein.
Aber es ist immer noch ein Problem, wenn ich zur vorherigen Lektion zurückkehre.

Hier ist der Fix, den ich benutze:

Wenn der Cursor nicht mehr reagiert, scrollen Sie zur letzten Zeile des Codes - normalerweise gibt es eine leere Zeile.

Platzieren Sie den Cursor auf der leeren Zeile und bringen Sie den Cursor mit "Löschen" oder "Rücktaste" auf die Zeile, in der sich Text befindet.

Der Cursor funktioniert jetzt gut für diese Herausforderung.

Ich habe dieses Problem seit Challenge # 35 mit Chrome unter Windows 10. Das Problem besteht weiterhin zeitweise. Wenn ich wieder darauf stoße, werde ich es aufnehmen.

habe das gleiche Problem hier

Gleicher Fehler. Verwenden des neuesten Chrome mit Windows 8.1. Ich erinnere mich nicht genau, mit welcher Herausforderung es begonnen hat, aber meine Vermutung würde irgendwo zwischen 30 und 35 liegen.

Gleiches geschah einmal auf dem Handy.

Obwohl es keine sehr gute Demonstration dieses Fehlers ist, habe ich es geschafft, ein GIF des Cursors zu erstellen, der eine Zeile überspringt.
animation

Vielen Dank an alle für Ihre Berichte.
Wir haben CodeMirror vor einigen Tagen aktualisiert (siehe https://github.com/FreeCodeCamp/FreeCodeCamp/pull/8737) und dieses Problem wird hoffentlich mit diesem Update behoben. Ich werde es schließen, aber bitte, @ sadathanwar17 ,


Bitte lesen Sie die Richtlinien für Beiträge , danke!.


@ sadathanwar17 @bugron Dieser Fehler scheint immer noch aktiv zu sein. Ich kann es hier reproduzieren https://www.freecodecamp.com/challenges/create-a-text-field.

  • Chrome 50.0.2661.102
  • Macintosh OS X 10.11.2
  • Browsergröße 1680 x 952
  • Bildschirmauflösung 1680 x 1050

cursor-bug

Danke @ sadathanwar17!
Ja, ich kann das manchmal noch reproduzieren. und wie auch von einem anderen Problem bestätigt.

Wiedereröffnung.

Das passiert jetzt auch für mich. Ich weiß nicht, ob dies hilft, aber es begann erst um Übung 30-35ish als jemand, der oben erwähnt wurde (sehr grobe Schätzung, da ich nicht darauf geachtet habe). Vielleicht spielt die Länge des Codes oder die Anzahl der Zeilen irgendwie eine Rolle. Die erste Handvoll funktionierte einwandfrei, aber als ich am Ende des Editors angekommen war (und anschließend die Bildlaufleiste angezeigt wurde), bemerkte ich es. Nur ein zufälliger Gedanke.

Ich muss @mbrannon zustimmen. Ich bekomme es auf "Optionale Aktionen mit

Ich habe genau das gleiche Problem wie dmatt. Die Spalte einiger Zeilen kann nicht ausgewählt werden. Es scheint, als ob der Code und die zulässigen Zeilen falsch ausgerichtet sind, da die Auswahlbarkeit der Spalten von der nachfolgenden Zeile abhängt.

Ausführen von Windows 10 auf der neuesten Version von Chrome auf Surface Pro 3

Ich habe das gleiche Problem, da immer noch das neueste Google Chrome unter Windows 10 ausgeführt wird.

+1
Ich habe das gleiche Problem, über das die Leute in der ersten HTML-Lektion in allen Übungen diskutieren. Ich denke, Ausgabe Nr. 8226 erklärt das Problem gut.

Es scheint, dass sie nicht an diesem Problem gearbeitet haben, weil ich bis jetzt das gleiche Problem habe. Und ich bin erst gestern zur FCC gekommen.

+1 Problem zeitweise, Aktualisierung hilft manchmal. Wenn Sie ein Zeichen eingeben und es dann vorübergehend entfernen, wird es für diese Herausforderung behoben

Ich denke, dies wird durch Zeilenumbruch verursacht. Durch Ändern des Seitenzooms, bis Zeilen nicht umbrochen werden, wird das Problem behoben.
Vielleicht sollten wir einfach nicht wickeln ...

Dieses Problem ist ziemlich ärgerlich. Das Entfernen der Klasse CodeMirror-Wrap aus dem oberen Bereich scheint das Problem zu beheben
<div class="CodeMirror cm-s-monokai CodeMirror-wrap" style="width: 100%; height: auto;">

@heldersepu bedankt sich vielmals für die eingehende Analyse, dies ist jedoch ein wirklich kniffliger Fehler. Wenn ich die Umhüllung entferne und die native Bildlaufleiste hinzufüge, wird der Editor auf seltsame Weise gerendert.

Vielleicht kann das behoben werden, aber der mühsamere Teil ist, dass ich dies auf meinem lokalen Setup nicht mehr reproduzieren kann.

Es ist immer noch da in der Produktion (Hauptwebsite).

Fühlen Sie sich frei, eine Pull-Anfrage zu stellen, wenn Sie möchten, mit einer endgültigen Lösung.
Noch einmal vielen Dank.

Was ist, wenn Sie ein Skript geschrieben haben, das bis zum Ende der letzten Zeile im Code-Editor ging und dann 1 Zeichen gelöscht hat (nicht im Hintergrund)? Dann könnte der Benutzer seinen Cursor danach an einer beliebigen Stelle platzieren ... nur eine Lösung für jetzt?

Ich sehe ehrlich gesagt keinen Wert auf dem Zeilenumbruch ...
Wenn es nach mir geht, deaktiviere ich einfach den Wrap und vergesse die Bildlaufleisten.
Am 16. Juni 2016, 08:43 Uhr, "Mrugesh Mohapatra" [email protected]
schrieb:

@heldersepu https://github.com/heldersepu vielen Dank für die Tiefe
Analyse, aber dies ist ein wirklich kniffliger Fehler, wenn ich die Umhüllung und entferne
Fügen Sie die native Bildlaufleiste hinzu, die der Editor auf seltsame Weise gerendert hat.

Vielleicht kann das behoben werden, aber der langweiligere Teil ist, dass ich nicht kann
scheinen dies auf meinem lokalen Setup nicht mehr zu reproduzieren.

Es ist immer noch da in der Produktion (Hauptwebsite).

Fühlen Sie sich frei, eine Pull-Anfrage zu stellen, wenn Sie möchten, mit einer endgültigen Lösung.
Noch einmal vielen Dank.

- -
Sie erhalten dies, weil Sie erwähnt wurden.
Antworte direkt auf diese E-Mail und sieh sie dir auf GitHub an
https://github.com/FreeCodeCamp/FreeCodeCamp/issues/7847#issuecomment -226473258,
oder schalten Sie den Thread stumm
https://github.com/notifications/unsubscribe/AAhSwiySJLjhb0l-M78ZmGbh69lo4rNQks5qMUTjgaJpZM4H91tE
.

@leonsegal hier ein einzeiliges Skript, das das Problem behebt:
$(".CodeMirror-wrap").removeClass("CodeMirror-wrap")

@heldersepu Nun , wir können entweder die Bildlaufleisten oder den Wrap haben, sonst kann der Code nicht in kleineren Ansichtsports durchsucht werden.

@heldersepu also sollte ich den Code in meinem Browser jedes Mal manuell bearbeiten, wenn ich die Seite benutze?

@raisedadead Ich habe kein voll funktionsfähiges lokales Setup, aber wenn Sie die Datei create-editor.js ändern können in:
lineWrapping: false,
Stellen Sie sicher, dass das Div ohne den CodeMirror-Wrap gerendert wird.

Aber dies ist etwas, das mit anderen Betreuern konsultiert werden sollte, um es einer Art Abstimmung zu unterziehen.

@heldersepu Ich habe genau das getan.

Zuerst entfernte ich die Verpackung,
lineWrapping: false

Dadurch konnte ich den Code nicht horizontal durchsuchen (für längere Zeilen).
Also habe ich versucht, die Bildlaufleisten mit hinzuzufügen
scrollbarStyle: 'native',

Dies macht das Ganze auf eine sehr seltsame Art und Weise. Darüber hinaus ist dieses Problem im lokalen Setup NICHT reproduzierbar, sodass das Update vor einem Push nicht mehr testbar ist.

@leonsegal leider ja (bis ein endgültiger Fix bereitgestellt wird, denken Sie daran, dass ich diese Rechte nicht habe). Das habe ich verwendet, um das zu umgehen.

@raisedadead über das horizontale Durchsuchen des Codes nicht möglich
Wenn Sie auf die lange Zeile klicken und die Taste [Ende] drücken, gelangen Sie dann zu dieser Zeile?
Was ist mit dem Bewegen mit den Pfeiltasten?

Nein, nichts scheint zu funktionieren, die Maustasten, die Pfeiltasten nichts.

PS Lassen Sie uns den Chat im Chatraum der Mitwirkenden fortsetzen .

Ich glaube, ich habe das Problem meistens bemerkt, als der Code lang genug wurde, um einen vertikalen Bildlauf zu erfordern, nicht so sehr ein Problem mit dem Zeilenumbruch (obwohl ich mich irren könnte). Nur ein Gedanke.

Nur um unsere Ergebnisse aufzuzeichnen:

+1

+1

Ich habe es mit Firefox, Safari, Edge, Chrome, Vivaldi und Opera versucht, aber dieses Problem funktioniert weiterhin.

Ich verwende Chrome v51 64bit (neueste Version) auf dem Mac und habe immer noch das gleiche Problem.

Hey Leute, dies ist ein bestätigtes Problem. Bitte verwenden Sie stattdessen die Reaktionen im ersten Beitrag zur Bestätigung.

image

Lassen Sie uns den Thread nur für mögliche Lösungen sauber halten.

das gleiche Problem tritt immer noch auf
Betriebssystem: Ubuntu
Browser: Chrom

Auch für mich immer noch vorkommend. Es scheint um die 60er Jahre für mich begonnen zu haben.

Betriebssystem: Windows 10
Browser: Firefox

Wenn jemand an einer langfristigen Problemumgehung interessiert ist, habe ich diese Chrome-Erweiterung mit dem Skript von @heldersepu verwendet : $ (". CodeMirror-wrap"). RemoveClass ("CodeMirror-wrap")

Ich habe Leerzeichen verwendet, um herauszufinden, wo sich der Cursor befindet, im Gegensatz zu Enter (Erzwingen eines Zeilenumbruchs). Es war eine geringere Auswirkung für mich. Ich würde einen "vorgeschlagenen Browser" für FCC-Übungen unterhalten, wenn wir eine Lösung für eine dieser Übungen finden.

Ich habe dieses Problem seit einer sehr frühen Übung erlebt. Ich habe gerade 100 getroffen.

Betriebssystem: OSX
Browser: Chrome & Safari

Ich frage mich, ob es möglicherweise mit der Installation von Chrome-Erweiterungen zu tun hat. Ich habe eine Handvoll: Adblocker, Microsoft Rewards (nicht beurteilen), Honey, Avast, Grammatik, Mightytext. (Das heißt, ich erlebe dies in Safari, das ich sehr selten benutze und auf dem ich keine Erweiterungen bewusst installiert habe.)

Die von @sethmchris vorgeschlagene (von @helderspu erstellte) Problemumgehung scheint jedoch den Trick getan zu haben. (Vielen Dank)

Dieser ist schwer zu testen, da ich noch niemanden gesehen habe, der ihn lokal reproduziert, und er scheint sich auf der Grundlage von Bedingungen zu zeigen, die noch zu bestimmen sind. Ich nehme an, die beste Vorgehensweise könnte darin bestehen, ein paar nicht brechende Korrekturen hinzuzufügen, um zu sehen, ob man sie behebt.

Hier einige Beobachtungen:
1) Vielleicht wird React-Codemirror dies beheben, wenn die React-Updates live gehen?
2) Gemäß dem Vorschlag von @heldersepu für die Verwendung von simplescroll kann ich nicht scheinen, dass es lokal korrekt angewendet wird. Es verhindert, dass der Editor korrekt geladen wird, und die Konsole zeigt den Fehler an: TypeError: CodeMirror.scrollbarModel[cm.options.scrollbarStyle] is not a constructor . Derzeit ist der ScrollbarStyle auf null Vielleicht ist es einen Versuch wert, ihn auf native zu setzen. Wenn Sie den native auf
3) In diesem Thread kann ich vorschlagen, editor.refresh() in Zeile 40 der Erstellungseditor- Datei einzufügen.

Um nicht von den oben genannten Punkten abzuweichen, könnte es auch funktionieren, den Wrap in false ändern. Wie @raisedadead hervorhob , würde es beim horizontalen Scrollen Fehler verursachen, wenn wir den ScrollbarStyle nicht gleichzeitig in native anstelle von null ändern.

Hallo, ich bin neu in diesem Programm und habe bei der ersten Herausforderung das gleiche Problem festgestellt. Es ist wirklich ärgerlich, besonders wenn ich das Gefühl habe, auf einer Rolle zu sein und zu wissen, was ich tun werde, aber nicht sofort etwas tun kann, weil der Cursor nicht dorthin will, wo ich es brauche .

Wenn jemand eine Lösung hat, erzähl mir bitte davon, ich würde es sehr schätzen.

Danke im Voraus

@ arias93jordy ein paar Beiträge hoch @sethmchris hat eine

Vielen Dank, dass Sie @sethmchris! Diese Lösung hat bei mir funktioniert.

@sethmchris Ich habe Ihre Lösung ausprobiert, aber sie funktioniert bei mir nicht ... Sie deaktiviert die Spiegelumhüllungsfunktion, aber der Cursor macht immer noch, was er will :( Vielleicht mache ich es falsch? Ich habe einfach die Erweiterung installiert und Ihr Stück kopiert Code und aktivierte die Erweiterung auf der FCC-Website ... Fehlt mir etwas?

Windows 10, Chrome-Version Version 54.0.2840.71 m.

Ich habe festgestellt, dass der Fehler auftritt, wenn das mit der Lektion geladene Codebeispiel Zeilen enthält, die lang genug sind, um in die nächste Zeile eingefügt zu werden. Wenn alle Zeilen kurz sind, gibt es kein Problem.

Wenn Sie in die oberste Zeile (Position 0, Zeile 0) gehen und einmal die Entf-Taste drücken, scheint das Problem behoben zu sein.

Ja Dankeschön!

Am Dienstag, den 1. November 2016 um 03:34 Uhr schrieb svershin [email protected] :

Windows 10, Chrome-Version Version 54.0.2840.71 m.

Ich habe festgestellt, dass der Fehler auftritt, wenn das Codebeispiel mit dem geladen wird
Die Lektion enthält Zeilen, die lang genug sind, um mit der nächsten fortzufahren
Linie. Wenn alle Zeilen kurz sind, gibt es kein Problem.

Gehen Sie zur obersten Zeile (Position 0, Zeile 0) und drücken Sie einmal die Entf-Taste
um das Problem zu lösen.

- -
Sie erhalten dies, weil Sie diesen Thread abonniert haben.
Antworte direkt auf diese E-Mail und sieh sie dir auf GitHub an
https://github.com/FreeCodeCamp/FreeCodeCamp/issues/7847#issuecomment -257534503,
oder schalten Sie den Thread stumm
https://github.com/notifications/unsubscribe-auth/ASTtQD6EtjYcLsMBHxY45d5-uEbIq5Zqks5q5xWfgaJpZM4H91tE
.

Google Chrome - Verifiziert Offen am 11.11.16.

Schritte zum Reproduzieren:
1.) Laden Sie eine Seite mit dem Code-Editor, der eine lange Zeile enthält, z. B. [https://www.freecodecamp.com/challenges/center-text-with-bootstrap]
2.) Verkleinern Sie die Seite auf eine Größe, in der die Linien umbrochen werden.
3.) Führen Sie eine Hard-Aktualisierung der Seite durch.
4.) Klicken Sie auf die rechte Seite des Editors.
5.) Beachten Sie, dass sich das Caret oft nicht bis zum Ende der Linie bewegt.

Hey Leute, dies ist ein bestätigtes Problem. Bitte verwenden Sie stattdessen die Reaktionen im ersten Beitrag zur Bestätigung.

image

Lassen Sie uns den Thread nur für mögliche Lösungen sauber halten.

Ich kann das Problem sowohl im Edge-Browser als auch in Chrome reproduzieren. Um es zum Stoppen zu bringen (nur für die aktuelle Herausforderung), zoome ich heraus und dann wieder hinein. Es ist scheiße, aber es funktioniert für mich.

Ich hatte dieses Problem, auf das @erictleung hier verwiesen hat

Aus irgendeinem Grund erhielt ich keine E-Mail-Benachrichtigung, dass jemand darauf geantwortet hatte, bis das Problem geschlossen wurde.

Das Drücken der Eingabetaste scheint das Problem zu beheben

Ich habe das gleiche Problem:

  1. Der Cursor kann in einigen Bereichen weder mit einem Klick noch mit Tastaturpfeilen positioniert werden
  2. Wenn ich versuche, etwas zu löschen, werden andere Dinge gelöscht, z. B. die Cursorposition ist falsch

Dies geschieht mit Chrom und Firefox
Update: Die Schaltfläche "Code zurücksetzen" hat diesmal geholfen, aber nur bei einer bestimmten Herausforderung ..... in der nächsten reproduziert sich das Problem von selbst .... und ich bin gezwungen, den Code erneut zurückzusetzen, und dies geschieht jedes Mal mit neuem Herausforderung.

Ich habe die Konversation in diesem Thread vorübergehend nur für Mitarbeiter gesperrt. Dies wurde in der Inszenierung behoben und wird bald live sein.

Das Update kann auf der Beta-Website bestätigt werden.

Die Problemumgehung, die derzeit auf der Produktionswebsite angezeigt wird, lautet:
Drücken Sie die Eingabetaste im Herausforderungseditor und fahren Sie mit der Herausforderung fort.

Entschuldigung für die Unannehmlichkeiten in der Zwischenzeit.

Erreichen Sie uns im Chatraum, wenn Sie Hilfe benötigen.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen