Etherpad-lite: Neues FlexLayout / Browser-Kompatibilität

Erstellt am 20. Apr. 2020  ·  34Kommentare  ·  Quelle: ether/etherpad-lite

Wir sollten es ernsthaft auf den meisten möglichen Browsern testen. Ich denke, es gibt einige Tools, um das online zu tun, wenn Sie welche kennen, informieren Sie mich bitte :)

Außerdem denke ich, dass wir unserer Asset-Pipeline einen Präfix hinzufügen sollten.
Prefixer konvertiert CSS-Regeln wie display: flex in etwas wie

display: -webkit-box;
display: -ms-flexbox;
display: flex

Wie funktioniert die Asset-Pipeline derzeit? Wo findet die CSS-Minify statt? Wenn du mir die richtige Richtung zeigen könntest wäre nett :)

Bitte mir zuordnen

Hilfreichster Kommentar

Hallo ! danke, aber das ist anders, und ich habe es bereits zusammen mit dem Refactoring hinzugefügt ;)

https://github.com/ether/etherpad-lite/blob/develop/src/static/css/pad/normalize.css

Alle 34 Kommentare

Vielleicht ist es zu spät, aber wie wäre es mit der Implementierung von normalize.css ? Es würde definitiv das vorhandene Plugin-Layout zerstören, daher bin ich nicht ganz sicher, ob es an der Zeit ist, dies zu tun ...

Hallo ! danke, aber das ist anders, und ich habe es bereits zusammen mit dem Refactoring hinzugefügt ;)

https://github.com/ether/etherpad-lite/blob/develop/src/static/css/pad/normalize.css

image

Beachten Sie den weißen Balken am unteren Rand, der den Pad-Text abschneidet

Firefox unter Windows

übrigens @JohnMcLear Fleisch des Glücks / Happy Meat 😄 🍖

Wie funktioniert die Asset-Pipeline derzeit? Wo findet die CSS-Minify statt? Wenn du mir die richtige Richtung zeigen könntest wäre nett :)

Sehen Sie sich src/node/utils/Minify.js an .

Dieser spezielle Teil (zusammen mit der "eigenartigen" Startsequenz und dem Cache-Handling) ist einer der Teile der Codebasis, die wirklich ihr Alter zeigen.

Ich werde nicht mehr als ein paar Zeilen für diese Datei ausgeben. Alles, was komplexer ist, verdient es, sich die Zeit zu nehmen, Bestehendes zu zerreißen und auf moderneren Grundlagen wieder aufzubauen (hoffentlich ohne zu viel Komplexität einzubringen).

Es kann in der Tat eine fruchtbare Arbeit sein.

übrigens @JohnMcLear幸せの肉 = Fleisch des Glücks / Happy Meat 😄 🍖

Hahah, auf keinen Fall habe ich eine Weile in Nagoya und Tokio gearbeitet und mir wurde das nie gesagt! Japanische Höflichkeit, denke ich! Geniale Übersetzung! :P

@seballot hat heute eine Reihe von Korrekturen vorgenommen, aber wir sind immer noch nicht bereit für die Veröffentlichung, die meisten Fehler sind jetzt in Safari, also habe ich Sebastian meine Saucelabs-Anmeldeinformationen gegeben und er kann dort debuggen :)

@JohnMcLear , ack.
@seballot , schließen Sie, wenn dies erledigt ist.

An den anderen Artikeln arbeite ich in der Zwischenzeit.

Hallo ! Danke @JohnMcLear , Saucelabs war ziemlich nützlich (auch wenn es soooo langsam ist !!)

Ich habe einige Korrekturen vorgenommen und nach meinen Tests funktioniert die neue Benutzeroberfläche von

Firefox 30 (aktuell 75)
Kante 16 (aktuell 80)
IE -> funktioniert nicht, aber Etherpad funktioniert überhaupt nicht, auch mit altem Layout
Chrom 49 (aktuell 81)
Safari 9 (aktuell 13)

Wir verlieren etwas Browserkompatibilität, die alte Version hat zum Beispiel mit Safari 8 funktioniert. Aber ich denke, es ist in Ordnung, oder?

Ich teste auch mit dem mobilen Emulator, wobei ich jedes Mal die älteste vorgeschlagene Version verwende, und es hat gut funktioniert.

Sobald es zusammengeführt und auf video.etherpad.com übertragen wurde, werde ich einen letzten Test durchführen und das Ticket schließen

Oh und ich habe versucht, CSS Autoprefixer hinzuzufügen, aber es hat nicht funktioniert ... Und eigentlich denke ich, dass es nicht so viel geholfen hätte, vielleicht funktioniert es 2 oder 3 alte Browserversionen

Zusammengeführt, live auf video.etherpad.com

Ein letzter Fehler

Wenn Sie den Zugriff auf die Kamera verweigern, endet der weiße Pad-Bereich in deutlichem Abstand von der Text-Chat-Spalte.

image

ja das ist der Kommentarbereich

Ich denke, das ist eher ein ep_webrtc-Fehler?

okay

sieht dann verschließbar aus :) gute arbeit!

Ich glaube, ich bin beim Importieren auf einen bösen Fehler gestoßen.

Bin gerade nicht an meinem PC, ich poste so schnell wie möglich einen Screenshot.

oh ja, Inhalt ist in zwei Spalten doppelt vorhanden, hast du das gleiche? ziemlich lustig

oh und tatsächlich hat mein letzter Commit etwas kaputt gemacht, weil mein Browser lokal selbst bei erzwungener Aktualisierung CSS aus dem Cache im iframe-Editor lädt, sodass wir das Pad nicht mehr scrollen können! Behoben, kümmert sich jetzt um den Import

image

Dies ist kein Scrollbar-Bug nur für Ref.

image
Der Importfehler =D Ich kann nicht glauben, dass der Testläufer das nicht bemerkt hat ... ;/

Auch nach "Jetzt importieren" sollte sich das Popup nicht schließen? Geringes Problem. Behebt das Markdown-Element in der Liste..

handleFrameCall: function(directDatabaseAccess, status)
    {
      if (status !== "ok")
      {
        importFailed(status);
      }
      // commenting that line make it works fine...
      // if(directDatabaseAccess) pad.switchToPad(clientVars.padId);
      importDone();
    },

aber ich frage mich, ob das Entfernen dieser Zeile unbeaufsichtigte Folgen haben wird.

und zum Schließen des Popups, gute Idee

if (status !== "ok")
      {
        importFailed(status);
      } else {
        $('#import_export').removeClass('popup-show');
      }
  // if(directDatabaseAccess) pad.switchToPad(clientVars.padId);

directDatabaseAccess wird für .Etherpad Dateiimporte verwendet.

pad.switchToPad(clientVars.padId); ermöglicht dem Benutzer, eine .etherpad Datei zu importieren, ohne eine Aktualisierung zu erzwingen.

directDatabaseAccess sollte false für alle Dateiimporte außer .etherpad , afaik...

pad.switchToPad sollte mit den Dingen anmutig umgehen.

@seballot aus irgendeinem Grund ist directDatabaseAccess undefined aber true ... Hier stimmt etwas nicht.. Fortsetzung der Ermittlungen.

console.log(typeof directDatabaseAccess)
Gibt String zurück, lolwtf.

      // Server sends a string, not a boolean
      if(directDatabaseAccess !== 'undefined') pad.switchToPad(clientVars.padId);

Ist der Fix, den ich für HTML et al. Behebt jetzt das pad.switchToPad Problem

Vielen Dank ! Vergessen Sie nicht, die Codezeile hinzuzufügen, um das Popup zu schließen :)

if (status !== "ok")
      {
        importFailed(status);
      } else {
        $('#import_export').removeClass('popup-show');
      }

Ich habe eine Lösung zusammengestellt, die unschön ist, aber funktioniert:
https://github.com/ether/etherpad-lite/pull/3915

Im Idealfall würde der Import den Browser nie aktualisieren, aber im Moment erledigt er die Aufgabe, 1.8.3 aus der Tür zu bekommen.

Zusammenfassend, Jungs:

  1. Denken wir daran, eine Aktualisierung nach einem Import zu erzwingen, um die "Benutzeroberfläche wird zu zwei Spalten" nach einem Import zu umgehen?
    Edit : Diskutieren wir mit dem Code vor uns: Bitte antworten Sie nicht hier, sondern auf #3915.

  2. Ist dies der einzige CSS/UI-Fehler, der noch besteht, oder haben wir noch etwas unter dem Radar?

Nö, nichts anderes unter dem Radar für mich!

Nö, nichts anderes unter dem Radar für mich!

OK danke. Ich schließe diese Ausgabe, konzentrieren wir uns auf #3915.

Nachdem wir dieses Problem gelöst haben, haben wir nur eine Dokumentationsänderung und können dann :partying_face:

@seballot , wären Sie bereit, an der Website (https://github.com/ether/ether.github.com/issues/30) zu arbeiten? Ein einfaches Aktualisieren der Screenshots würde vorerst mehr als ausreichen.

Bearbeiten : Was ist falsch an der automatischen Vervollständigung von Github? Ich schreibe die Nummer einer Ausgabe, und sie wird zu einer anderen vervollständigt.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen