Skip to content

hero[_\-a-z] partial selector strips article hero images and captions #279

Description

@MaxWolf-01

hero[_\-a-z] partial selector strips article hero images and captions

The partial selector hero[_\-a-z] removes any element whose class contains hero-… or hero_…, including legitimate article hero images and their captions.

Example

https://www.crosslabs.org/blog/artificial-life

<div class="blog-post-wrap">
  <h1 class="h1">Artificial Life</h1><div class="blog-hero-image-wrap">
    <img class="blog-hero-image" alt="" src="…artificial_life.jpg" />
    <div class="blogherocaption">
      <div class="blog-image-caption">A depiction of artificial cybernetic entity… Image Credit: Generated by Olaf Witkowski using DALL-E version 2, August 21, 2024.</div>
    </div>
  </div>
  <div class="rich-text-element w-richtext">… article body …</div>
</div>

Expected: hero image + caption present in output.

Actual: both removed. _removeCoverImage doesn't apply — og:image points to a different asset.

Debug trace:

{ reason: "partial match: hero[_\\-a-z]", text: "" }   // <img class="blog-hero-image">
{ reason: "partial match: hero[_\\-a-z]", text: "" }   // <div class="blog-hero-image-wrap">
{ reason: "partial match: hero[_\\-a-z]", text: "A depiction of artificial cybernetic entity…" }

Affects any site whose content image wrapper class contains hero- (common Webflow pattern).

Fix direction

Skip the match when the element is or contains a <figure> with <figcaption>, or restrict hero[_\-a-z] to elements above the content boundary.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions