Firefox@Ubuntu: Clickverhalten der Addressbar wiederherstellen

Angenommen, ich bin auf www.google.com. Doppelklicke ich auf “google”, dann erwarte ich, dass “google” ausgewählt wird. Der Firefox (unter Ubuntu) wählt aber – und das schon beim ersten Klick – alles aus. Absolut nervig, und auch anders als überall sonst. Ich kann es nicht leiden, wenn Software schlauer sein möchte als der Benutzer 😠 Leider funktioniert Pale Moon immer schlechter, Renderfehler etc., aber das ist ein anderes Thema.

Also:

browser.urlbar.doubleClickSelectsAll = false

1	browser.urlbar.doubleClickSelectsAll = false

stellt das korrekte Verhalten wieder her. Und wenn man schon mal da ist, kann man direkt

browser.urlbar.clickAtEndSelects = true

1	browser.urlbar.clickAtEndSelects = true

setzen. Von.

Überlaufende Texte finden

Eine bessere ~~Übersetzung~~ Umschreibung für text-overflow ist mir nicht eingefallen 🙃

In jQuery ginge das so:

$.expr[':'].truncated = function (e) {
  // ggf. Style checken, bspw.
  // $(e).css('text-overflow') === 'ellipsis'
  return e.offsetWidth < e.scrollWidth;
};

// dann:
let items = $('.your-selector:truncated');

$.expr[':'].truncated = function (e) {

// ggf. Style checken, bspw.

// $(e).css('text-overflow') === 'ellipsis'

return e.offsetWidth < e.scrollWidth;

};

// dann:

let items = $('.your-selector:truncated');

Cross-post; basiert auf den Antworten hier. Bonus: In Selenium geht das so:

WebElement element = ...;

// element is truncated?
double offsetWidth = Double.parseDouble(element.getAttribute("offsetWidth"));
double scrollWidth = Double.parseDouble(element.getAttribute("scrollWidth"));
assertThat(offsetWidth < scrollWidth).isTrue();

// truncation style is ellipsis?
String overflowStyle = element.getCssValue("text-overflow");
assertThat(overflowStyle).isEqualTo("ellipsis");

WebElement element = ...;

// element is truncated?

double offsetWidth = Double.parseDouble(element.getAttribute("offsetWidth"));

double scrollWidth = Double.parseDouble(element.getAttribute("scrollWidth"));

assertThat(offsetWidth < scrollWidth).isTrue();

// truncation style is ellipsis?

String overflowStyle = element.getCssValue("text-overflow");

assertThat(overflowStyle).isEqualTo("ellipsis");

bäm.

Selenium: Touchgesten simulieren

Wer mit Selenium Touchgesten simulieren will (hier: Pull-to-Refresh 🙂), der benötigt zuerst mal einen Browser, der Touch unterstützt:

Map<String, Object> someDeviceMetrics = ...; // see link

Map<String, Object> emulation = new HashMap<>();
emulation.put("deviceMetrics", someDeviceMetrics);
emulation.put("userAgent", "<some user agent>");

ChromeOptions options = new ChromeOptions();
options.setExperimentalOption("mobileEmulation", emulation);

WebDriver driver = new RemoteWebDriver(SELENIUM_URL, options);

Map<String, Object> someDeviceMetrics = ...; // see link

Map<String, Object> emulation = new HashMap<>();

emulation.put("deviceMetrics", someDeviceMetrics);

emulation.put("userAgent", "<some user agent>");

ChromeOptions options = new ChromeOptions();

options.setExperimentalOption("mobileEmulation", emulation);

WebDriver driver = new RemoteWebDriver(SELENIUM_URL, options);

Der Rest ist dann einfach:

public class Browser implements HasTouchScreen, ... {
  // ...

  @Override
  public TouchScreen getTouch() {{
    return driver instanceof HasTouchScreen ?
        ((HasTouchScreen) driver).getTouch() :
        new RemoteTouchScreen(new RemoteExecuteMethod((RemoteWebDriver) driver));
  }
}

// ...

// offsetX/offsetY = the distance to be panned
new TouchActions(getBrowser())
      .flick(target, offsetX, offsetY, 200)
      .perform();

public class Browser implements HasTouchScreen, ... {

// ...

@Override

public TouchScreen getTouch() {{

return driver instanceof HasTouchScreen ?

((HasTouchScreen) driver).getTouch() :

new RemoteTouchScreen(new RemoteExecuteMethod((RemoteWebDriver) driver));

}

// ...

// offsetX/offsetY = the distance to be panned

new TouchActions(getBrowser())

.flick(target, offsetX, offsetY, 200)

.perform();

(wenn man davon absieht, dass der vierte Parameter laut Sourcecode 0, 1 oder 2 sein sollte, nicht 200 – getestet mit selenium-java 3.9.1)

Javascript: “Pull to refresh”

Pull-to-refresh in (mobilen!) Webseiten nachzubauen, ist jetzt keine Raketenwissenschaft, aber doch so viel Aufwand, dass sich ggf. eine Library lohnt. Viele (? einige? apeatling, ember-gestures, …) bauen aber auf hammer auf, und das hat einen Bug (Beispiel, es gibt weitere Tickets) im Zusammenspiel von Panning (also dem “Pull” in “Pull-to-refresh”) und Scrolling. Zusammengefasst: Es geht nur eines von beiden. Mit ein wenig Drumherumgehacke bekommt man das etwas näher zusammengeführt, aber entweder kommt PanEnd dann gar nicht (was das “refresh” schwierig macht), oder bspw. die PanMove-Events kommen nicht zuverlässig (wodurch man den “pull” nicht 1:1 an den Finger des Nutzers hängen kann).

Ein npm-Modul, das nicht auf hammer aufbaut, wäre pulltorefreshjs (getestet mit 0.1.11 und 0.1.13):

PullToRefresh.init({
  mainElement: '.myCssSelector',
  onRefresh: () => {
    console.log('hello moto')
  },
});

PullToRefresh.init({

mainElement: '.myCssSelector',

onRefresh: () => {

console.log('hello moto')

});

In Ember sieht das als Komponente so aus:

import Component from '@ember/component';
import PullToRefresh from 'npm:pulltorefreshjs';
import {get, set} from '@ember/object';
import {getOwner} from '@ember/application';
import {inject as service} from '@ember/service';

export default Component.extend({
  classNames: ['pull-to-refresh'],

  router: service(),
  currentRouteInstance: undefined,

  didInsertElement() {
    this._super(...arguments);

    const owner = getOwner(this);
    const currentPath = owner.lookup('controller:application').currentPath;
    set(this, 'currentRouteInstance', owner.lookup(`route:${currentPath}`));

    // TODO use unique identifier for mainElement, store result of init()
    PullToRefresh.init({
      mainElement: '.pull-to-refresh',
      onRefresh: () => {
        get(this, 'currentRouteInstance').refresh();
      },
    });
  },

  willDestroyElement() {
    this._super(...arguments);

    // TODO destroy current ptr only; id is returned by init()
    PullToRefresh.destroyAll();
  },
});

import Component from '@ember/component';

import PullToRefresh from 'npm:pulltorefreshjs';

import {get, set} from '@ember/object';

import {getOwner} from '@ember/application';

import {inject as service} from '@ember/service';

export default Component.extend({

classNames: ['pull-to-refresh'],

router: service(),

currentRouteInstance: undefined,

didInsertElement() {

this._super(...arguments);

const owner = getOwner(this);

const currentPath = owner.lookup('controller:application').currentPath;

set(this, 'currentRouteInstance', owner.lookup(`route:${currentPath}`));

// TODO use unique identifier for mainElement, store result of init()

PullToRefresh.init({

mainElement: '.pull-to-refresh',

onRefresh: () => {

get(this, 'currentRouteInstance').refresh();

});

willDestroyElement() {

this._super(...arguments);

// TODO destroy current ptr only; id is returned by init()

PullToRefresh.destroyAll();

});

Auf dem Handy sollte das so schon funktionieren. Auf dem Desktop hatte ich das Phänomen, dass Hochcrollen immer erst beim zweiten mal funktioniert hat (und auch dann nur, wenn zwischen Versuch 1 und 2 nicht zu viel Zeit lag). Weil: Die Lib immer beim Hochscrollen den Loader anzeigt, wenn man die Funktion shouldPullToRefresh nicht vom default !window.scrollY ummapt, bspw. auf

shouldPullToRefresh: () => {
  let scrollTop = this.$().parent()[0].scrollTop;
  return scrollTop === 0;
},

shouldPullToRefresh: () => {

let scrollTop = this.$().parent()[0].scrollTop;

return scrollTop === 0;

Hochscrollen geht sonst nur, so lange der Loader angezeigt wird 🙃

Generische npm Module in Ember

Wer, wie ich, die ~~verfilzte~~ komplexe Javascript-Umgebung etwas… “unübersichtlich” findet, und sich fragt, wie zur Hölle man ein nicht-Ember-spezifisches npm-Modul in Ember importiert, dem kann geholfen werden:

Erst Browserify:

npm install ember-browserify --save-dev

1	npm install ember-browserify --save-dev

dann, voilà:

import PullToRefresh from 'npm:pulltorefreshjs';

1	import PullToRefresh from 'npm:pulltorefreshjs';

Neues Fenster in Web Apps

Anwendungsfall: Eine Bedienungsanleitung in Form eines PDFs in einem neuen Fenster/Tab öffnen. Internet sagt (hier am Beispiel Ember):

window.open('anleitung.pdf');

1	window.open('anleitung.pdf');

Das funktioniert grundsätzlich auch in Fullscreen Web Apps, aber da solche Apps keine Browsernavigation anzeigen, kommt man ggf. „nie wieder“ aus der geöffneten Seite raus. Abhilfe schafft

var a = document.createElement('a');
a.setAttribute('href', 'anleitung.pdf');
a.setAttribute('target', '_blank');
a.click();

var a = document.createElement('a');

a.setAttribute('href', 'anleitung.pdf');

a.setAttribute('target', '_blank');

a.click();

, was anleitung.pdf im „richtigen“ Browser anzeigt, statt innerhalb der App.

Kommentare, die die Welt nicht braucht – LXIII

Sabuwer..!! Funktioniert!!!

Kommentare, die die Welt nicht braucht – LXII

https://twitter.com/crusy/status/978882528974114817

https://twitter.com/crusy/status/978883549494431744

English for runaways, but sponge over.

Synology NAS “schläft” nicht zuverlässig

Problem: Mein Synology DS213j wacht ständig auf, Ursache unklar. Infrage kämen aus meiner Sicht:

DS photo. Nutze ich für automatische Backups meiner Fotos aufs NAS. Allerdings habe ich den entsprechenden Task mal deaktiviert, ohne Erfolg
Meine FRITZ!Box 6490 Cable, über die das NAS im Internet und LAN ist
der DynDNS-Dienst auf dem NAS
irgendein anderer Systemdienst/Task/Cron Job/… im DSM
irgendein anderer Netzwerk-Client

Lösung allerdings: Statische v4 IP und IPv6 deaktivieren 🙂 (via):

… > IPv4 > Manuelle Konfiguration verwenden > …

und:

Systemsteuerung > Netzwerk > Netzwerk-Schnittstelle > LAN > bearbeiten > IPv6 > IPv6-Setup: Aus

UPDATE: Funktioniert nur begrenzt; es wurde besser, aber nicht gut.

UPDATE; Danke, Thomas: Deaktivieren der Backup-Lösungen (“Acronis True Image”, kenn’ ich nicht; evt. auch iCloud) kann Wunder wirken

Marconi Union – Weightless

Es gibt offenbar einen Song, “der von Stress befreit” (es gibt weitere Quellen, aber die sagen alle Ähnliches) – man soll ihn tatsächlich nicht beim Autofahren u.ä. hören 😄. Klar, den muss ich mir anhören:

Watch this video on YouTube

Ich muss sagen: Joa. Hätte ich mehr von erwartet, vor allem nach dem Teil mit dem Autofahren. Aber falls das wer total geil findet: Ich empfehle Bohren & der Club of Gore; je nachdem, wen man fragt, spielen die “Horror-Jazz” (😳), “Doom Metal” oder: “Musik an der Grenze zum Stillstand”.