Annuncio della casa non centrato in topic-list-between (allineato a sinistra)

Bug
,
1

Riepilogo

Gli annunci interni (House ads) renderizzati nel posizionamento topic-list-between non sono più centrati sulla larghezza dell’elenco degli argomenti. Invece, appaiono allineati a sinistra (confinati nell’area della prima colonna). Questo sembra essere un regresso causato dal rendere il componente house-ad senza tag (tagless), il che interrompe la semantica della tabella.

Passaggi per Riprodurre

  1. Vai su Admin → Plugins → Ads
  2. Crea un House Ad
  3. Abilitalo per il posizionamento: topic-list-between
  4. Visita la homepage (o qualsiasi elenco di argomenti che utilizzi il layout standard a tabella)
  5. Osserva l’allineamento dell’annuncio interno

Comportamento Atteso

L’annuncio interno dovrebbe essere renderizzato centrato sull’intera larghezza dell’elenco degli argomenti (coprendo tutte le colonne), come avveniva in precedenza.

Comportamento Attuale

L’annuncio interno è allineato a sinistra e occupa solo la porzione sinistra della tabella (all’incirca lo spazio della colonna del “titolo dell’argomento”), anziché estendersi su tutta la riga.

Analisi Tecnica

Questo sembra essere causato da un markup di tabella non valido prodotto dal componente house-ad.

File:
plugins/discourse-adplugin/assets/javascripts/discourse/components/house-ad.gjs

Il componente è senza tag:

@tagName("")
export default class HouseAd extends AdComponent {

Ma renderizza un div con un attributo colspan:

<div
  colspan={{this.colspanAttribute}}
  class={{concatClass "house-creative" this.adUnitClass}}
  ...attributes
>

Perché questo si rompe

  • colspan funziona solo su <td> / <th>, non su <div>.
  • Nella tabella dell’elenco degli argomenti, questo si traduce in un <div> direttamente all’interno di un <tr>, che è HTML non valido e fa sì che il browser lo disponga in modo errato (tipicamente collassandolo nella regione della prima colonna).
  • La logica colspanAttribute() controlla this.tagName === "td" (o equivalente), ma poiché il componente è senza tag, non diventa mai "td", quindi colspan non viene effettivamente mai applicato.

Probabile Fonte del Regresso

Questo sembra essere stato introdotto dall’applicazione delle regole di linting/refactoring per i “componenti senza tag” (la modifica che ha convertito i componenti in tagless), che ha inavvertitamente interrotto i componenti che devono essere renderizzati come vere celle di tabella in alcuni connettori/posizionamenti.

Ambiente

  • Versione di Discourse: latest (tests-passed)
  • Plugin Ad: discourse-adplugin integrato
  • Browser testati: Chrome + Firefox (sembra indipendente dal browser)
1 Mi Piace