Hi.
When we change page in Discourse, these are the apparent steps:
We click on the link
The current content disappears and the loader appears
The URL is updated and the new content appears
This is slightly different when we go from a page to the home, as the URL is changed to the home URL when the current content disappears, and not when the new content appears.
My goal is to have a script that is executed as soon as we click any page link on Discourse. api.onPageChange won’t fit in this case since the code is executed quite at the same time the new page content is loaded.
Is there a Discourse method for that? I look at the event triggers but didn’t find any one corresponding to what I need.
There’s currently no method in the Plugin-API that will allow you to fire a script before a page transition because this has not come up before as far as I recall.
That said, you can leverage on the willTransition() action in the application route
You would use something that like this in your theme / component
// this fires after the transition
api.onPageChange((url, title) => {
console.log("after transition");
});
// this fires right before the transition
api.modifyClass("route:application", {
pluginId: "some-name",
actions: {
willTransition() {
// run core code first
this._super(...arguments);
// then do some work
console.log("before transition");
// you can also do something like this to see what data you have
// to work with like _router
console.log(this)
}
}
});
Quelques raisons pour lesquelles cela pourrait ne pas fonctionner :
Mettre des actions dans un hash est une ancienne syntaxe que nous n’utilisons plus dans Discourse. Théoriquement, cela devrait fonctionner, mais l’interopérabilité avec la nouvelle syntaxe pourrait ne pas être parfaite. La manière moderne serait
Le disclaimer standard modifyClass s’applique : c’est risqué et cela pourrait casser à tout moment
Je ne pense pas que willTransition soit garanti de se déclencher sur la route d’application dans toutes les situations. (par exemple, si une route enfant a une action willTransition, elle ne remontera pas nécessairement)
Je pense que vous aurez du mal à faire cela parfaitement. Ember s’attend à avoir le contrôle total du rendu, donc essayer de s’accrocher à des points arbitraires sera difficile et pourrait causer des problèmes (selon ce que vous essayez de faire).
Évidemment, je ne sais pas quel est votre objectif final… donc peut-être que la douleur est justifiée. Auquel cas : n’hésitez pas à m’ignorer
(bien sûr, si vous souhaitez ouvrir un sujet Dev sur le problème que vous essayez de résoudre, je serais heureux d’y jeter un œil)
Heureux d’être explicite car le code est open source :
Je travaille avec un fournisseur de publicité tiers et ils ont une fonction de réinitialisation de page publicitaire en javascript qui doit être exécutée avant que les publicités de la nouvelle page ne soient déclenchées.
Toute amélioration est la bienvenue et je l’ai déjà implémentée dans la liste des sujets avec le code de Johani. (dans un PR ouvert).
Mais cela a laissé le sujet… J’essaierai votre suggestion ensuite et l’adopterai dans les deux cas si cela améliore encore les choses.
Ah je vois, donc vous ne modifiez pas le DOM directement
Dans ce cas, j’espère que routeWillChange fonctionnera - il devrait certainement se déclencher avant que la prochaine route ne soit rendue.
La mise en garde est que… dans le cas de choses comme les redirections, il peut se déclencher deux fois. Ou peut se déclencher, puis la transition finit par être abandonnée. Mais peut-être que c’est acceptable dans ce cas.
Oui, pas de modification directe du DOM ici chez Merefield Technology Towers.
Oui, j’utiliserai le service, c’est à cela qu’il sert ! Je reviendrai avec mon expérience car je suis sûr que les résultats pourraient intéresser d’autres personnes.