Skip to content

Alt text missing from linked images in HTML code #2431

@Dogway

Description

@Dogway

Bug Description

Alt text is not kept in certain situations

Steps to reproduce

Create an HTML widget (in my case with Elementor)
Create some linked images
Check the page with WAVE addon for Chrome
Error appears on image

Screenshots

Additional Context

  • PHP Version: 8.4.19
  • OS: Windows 11
  • Browser: Chrome 146.0.7680.165
  • Plugin Version: 1.0.0-beta5
  • Device: PC

The issue might be happening in web-vitals.js.
This is the content of the HTML widget:

<div class="poster-marquee">
  <div class="poster-track">

    <div class="poster-row">
      <a href="https://asociaciondigitalcanaria.es/cursos/n8n/">
        <img src="https://asociaciondigitalcanaria.es/wp-content/uploads/2025/07/n8n-cover3.webp"
             alt="Curso de n8n – Automatización de flujos"
             loading="lazy" decoding="async">
      </a>

      <a href="https://asociaciondigitalcanaria.es/cursos/xaas-basico/">
        <img src="https://asociaciondigitalcanaria.es/wp-content/uploads/2025/07/XaaS.webp"
             alt="Curso XaaS básico – Modelos como servicio"
             loading="lazy" decoding="async">
      </a>

      <a href="https://asociaciondigitalcanaria.es/cursos/pre-impresion/">
        <img src="https://asociaciondigitalcanaria.es/wp-content/uploads/2024/09/Pre-Impresion.webp"
             alt="Curso de preimpresión"
             loading="lazy" decoding="async">
      </a>
    </div>
  </div>
</div>

<style>
.poster-marquee {
  overflow: hidden;
  width: 100%;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, white 20%, white 80%, transparent 100%);
          mask-image: linear-gradient(to right, transparent 0%, white 20%, white 80%, transparent 100%);
}

.poster-track {
  display: flex;
  width: max-content;
  animation: marquee 60s linear infinite;
}

.poster-row {
  display: flex;
  gap: 8rem;
  padding-right: 8rem;
}

.poster-row img {
  display: block;
  height: 17rem;
  width: auto;
  flex: 0 0 auto;
  border-radius: 8px;
}

@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
</style>

Metadata

Metadata

Assignees

No one assigned

    Labels

    [Type] BugAn existing feature is broken

    Type

    No type
    No fields configured for issues without a type.

    Projects

    Status

    Not Started/Backlog 📆

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions