Benutzerkarte öffnet sich nicht auf dem Handy

Beitragen Fehler
1

Nach dem Update auf 2.6.0.beta6 (3e1b94c227) öffnet sich die Benutzerkarte auf dem Mobilgerät nicht. Ich habe dies in Meta getestet, und es gab kein Problem. Vielleicht liegt dieses Problem daran, dass unser Discourse von rechts nach links (RTL) ausgerichtet ist.

Auf dem Desktop haben wir kein Problem, aber auf dem Mobiltelefon öffnet sich die Karte beim Tippen auf das Benutzerbild nicht; erst beim zweiten Tippen gelangt man zum Profil.

Es gibt keine Fehlerprotokolle…

Ich habe den Test mit einer Standardvorlage ohne weitere Komponenten durchgeführt.

Wir verwenden diese Plugins:

3 „Gefällt mir“
2

Ich kann die folgenden Klassen in RTL nicht sehen:

Könnte es sein, dass diese Datei nicht kompiliert wurde? Denn wir haben das Update über die Weboberfläche durchgeführt.

4

Unwahrscheinlich, aber möglich. Können Sie es über die Konsole neu erstellen?

1 „Gefällt mir“
5

Klar, das hatten wir für morgen geplant. Seit gestern haben wir vorübergehend die entsprechenden Codes im Theme hinzugefügt, um das Problem zu lösen.

6

Ich kann dieses Problem reproduzieren. Es sieht nach einem Fehler in R2 aus.

Wenn die Option :rtl an den Compiler übergeben wird, führt dieser das CSS durch R2 durch und führt die magischen RTL-Änderungen aus.

Das funktioniert großartig, aber aus irgendeinem Grund scheinen wir einen Randfall zu treffen, bei dem es zu einem durcheinandergeratenen CSS kommt. Wir verwenden ein Muster zum Erstellen eines Fade-Effekts für mobile Navigationsmenüs, das so aussieht:

Dies ist nicht der einzige Ort, an dem wir es verwenden; es ist nur ein Beispiel.

Es scheint, als ob dieses Muster mehr ist, als R2 bewältigen kann. Wir rufen eine RGBA-Funktion auf und übergeben ihr eine CSS-Variable, und fügen dann auch einen Stop hinzu.

Wenn dies durch R2 geleitet wird, erhält man so etwas wie:

jumbled CSS
jumbled CSS1101×786 278 KB

Wenn es ausgeschaltet ist (auch auf einem RTL-Lokal), erhalten wir dies:

correct css

Das durcheinandergeratene CSS bringt den Compiler durcheinander und veranlasst ihn, jegliches CSS, das nach dieser Regel kommt, zu nutzlosem Code zu quetschen, der nie angewendet wird.

Daher werden mehrere Stylesheets nach diesem einen auf mobilen RTL-Geräten nie geladen. Das Stylesheet für Benutzerkarten ist eines davon.

Ich habe versucht, die Komplexität dieses Musters zu reduzieren, indem ich die Stops entfernt habe, und es scheint zu funktionieren. Also wechseln wir von diesem:

background: linear-gradient(
  to right,
  rgba(var(--secondary-rgb), 0) 0%,
  rgba(var(--secondary-rgb), 1) 100%
);

zu diesem:

background: linear-gradient(
  to right,
  rgba(var(--secondary-rgb), 0),
  rgba(var(--secondary-rgb), 1)
);

Dies wird keine visuellen Änderungen verursachen – da dies ohnehin die Standard-Stops sind – und löst das Problem.

Ich habe eine PR gesendet, um dieses Muster überall dort zu aktualisieren, wo wir es hier verwenden:

Danke für die Meldung des Problems @nildarar :+1:

7 „Gefällt mir“
7

Wow, deine Beschreibung war sehr umfassend und hilfreich, und der Fehler war wirklich bizarr!

Einige der von dir erwähnten Fehler sind uns schon einmal begegnet, aber wir haben versucht, sie durch Überschreiben des CSS zu verbergen.

Vielen Dank, dass du dieses Problem so geduldig und sorgfältig gelöst hast, und danke für deine ausführliche Erklärung :pray: :slightly_smiling_face:

4 „Gefällt mir“