Allegro Seller Info 0.1.16

Mój skrypt użytkownika na allegro dorobił się kolejnej aktualizacji.

Zauważyłem dziś kilka dziwnych rzeczy występujących na listach z aukcjami. Niektóre elementy listy nie posiadają wstawek z informacjami o sprzedającym, a te niewidoczne na pierwszym planie jakby “doładowują” się w miarę ich wyświetlenia. Dotyczy to tylko pierwszej strony bazowej listy - tej widocznej po bezpośrednim załadowaniu strony, bo kolejne podstrony ładowane asynchronicznie działają już poprawnie.

Cześć z tych problemów wynika z faktu, że niektóre elementy <article/> na listach aukcji nie posiadają react-owych obiektów, z których to korzysta skrypt. Powoduje to niespodziewany undefined wywalający dalsze działanie kodu. Drobna poprawka w funkcji getReactInst niweluje wywalanie się, ale całościowy problem pozostaje.

Wszystko wskazuje na to, że początkowe elementy listy są takim placeholdererem, a dopiero przy fizycznym wyświetleniu w ViewPorcie budowana i renderowana jest przez Reacta docelowa wersja danej aukcji na liście. Stąd wynika problem braku tych poszukiwanych obiektów __reactInternalInstance$* w niektórych elementach listy.

Trochę podebugowałem kod serwisu i na szczęście szybko udało mi się znaleźć ciekawy punkt zaczepienia. Dzięki temu spokojnie mogłem olać głębsze zaangażowanie w irytujące i czasochłonne babranie się w wnętrznościach kodu strony. Przy przebudowie elementów <article/> z aukcjami na liście istniejące elementy w DOM-ie nie są modyfikowane, są po prostu usuwane, a w ich miejsce dodawane nowe zbudowane przez Reacta. To pozwoliło mi w łatwy sposób rozwiązać problem z “doładowywaniem” zawartości listy przez reakcję na zmiany w drzewie za pomocą MutationObserver-a.

// obserwuj zmiany na liscie ofert i uaktualniaj dodawane nowe elementy
var mutationObserver = new MutationObserver(function (mutations) {
	for (var mutation of mutations) {
		for (var node of mutation.addedNodes) {
			if (node.nodeName == 'ARTICLE')
				UpdateOffer(node);
		}
	}
});
mutationObserver.observe(listNode, { childList: true, subtree: true });

Taki kod załatwia też poprawne obsłużenie nowej zawartości listy aukcji po asynchronicznym załadowaniu kolejnej podstrony. Zatem mogłem pozbyć się poprzedniego obserwatora czekającego na zmianę klasy świadczącej o zakończeniu operacji ładowania nowych aukcji i przebudowy listy… co finalnie uprościło jeszcze bardziej istniejący kod.

Obecna funkcja UpdateOffer to nieco zmodyfikowana wcześniejsza UpdateList operująca na podanym elemencie zamiast na liście dostępnych elementów. Dodatkowo olewa jakiekolwiek działanie, gdy w danym elemencie dodano już wstawkę i można ją wywoływać wielokrotnie na tym samym elemencie.

Pozwala to na proste zabezpieczenie się na wypadek, gdyby obserwator został uruchomiony już po pierwszych aktualizacjach widocznych elementów po załadowaniu się strony i niektóre elementy nigdy nie zostałyby “poprawione”.

// zaktualizuj obecne oferty na liscie, na wypadek gdyby powyzszy
// MutationObserver zostal uruchomiony juz po zmianach...
for (var node of listNode.getElementsByTagName('article'))
	UpdateOffer(node);

A tak wystarczy “przelecieć” po wszystkich dostępnych elementach listy, jak to robiono wcześniej.

Niestety znów widoczny jest jakiś rozjazd w obiektach allegrowych, bo na aukcjach z “Allegro Lokalnie” w propsach brakuje niektórych danych i nazwa użytkownika w takich pozycjach wyświetlana jest jako “undefined”…

Nowa wersja skryptu - 0.1.16 dostępna jest już w moim repo UserScripts. Auto-aktualizacje wbudowane w UserJs-owe silnik powinny zadbać o automatyczna aktualizację skryptu… A teraz można czekać na kolejne zmiany i problemy ;)