BREAKING CHANGE: stop adding width/height to images automatically (sp…

…eced#4432)
w3c · Apr 21, 2023 · 4805f70 · 4805f70
1 parent a950478
commit 4805f70
Show file tree

Hide file tree

Showing 2 changed files with 0 additions and 101 deletions.
diff --git a/src/core/figures.js b/src/core/figures.js
@@ -50,8 +50,6 @@ const localizationStrings = {
 const l10n = getIntlData(localizationStrings);
 
 export function run() {
-  normalizeImages(document);
-
   const tof = collectFigures();
 
   // Create a Table of Figures if a section with id 'tof' exists.
@@ -120,24 +118,6 @@ function getTableOfFiguresListItem(figureId, caption) {
   </li>`;
 }
 
-function normalizeImages(doc) {
-  doc
-    .querySelectorAll(
-      ":not(picture)>img:not([width]):not([height]):not([srcset])"
-    )
-    .forEach(img => {
-      // Don't add width and height to SVGs
-      // https://github.com/w3c/respec/issues/3435
-      if (img.src.startsWith("data:image/svg+xml;")) return;
-      if (img.src.endsWith(".svg")) return;
-
-      if (img.naturalHeight === 0 || img.naturalWidth === 0) return;
-
-      img.height = img.naturalHeight;
-      img.width = img.naturalWidth;
-    });
-}
-
 /**
  * if it has a parent section, don't touch it
  * if it has a class of appendix or introductory, don't touch it

diff --git a/tests/spec/core/figures-spec.js b/tests/spec/core/figures-spec.js
@@ -126,87 +126,6 @@ describe("Core - Figures", () => {
     expect(tofItems).toHaveSize(1);
   });
 
-  describe("normalize images", () => {
-    const imgDataURL =
-      "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAADCAIAAADUVFKvAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4gQKACEWdS72PwAAABl0RVh0Q29tbWVudABDcmVhdGVkIHdpdGggR0lNUFeBDhcAAAAMSURBVAjXY2AgDQAAADAAAceqhY4AAAAASUVORK5CYII=";
-    const ops = {
-      config: makeBasicConfig(),
-      body: `<section>
-         <img id="image-with-no-dimensions" src="${imgDataURL}">
-         <img id="image-with-dimensions" height=100 width=200 src="${imgDataURL}">
-         <img id="image-with-height-only" height=100 src="${imgDataURL}">
-         <img id="image-with-width-only" width=200 src="${imgDataURL}">
-         <img id="image-with-srcset" srcset="${imgDataURL}">
-         <img id="image-svg-url" src="/img/foo.svg">
-         <img id="image-svg-data-uri" src="data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg"/>">
-         <picture>
-          <img id="image-inside-picture" src="${imgDataURL}">
-         </picture>
-      </section>`,
-    };
-
-    let doc;
-    beforeAll(async () => {
-      doc = await makeRSDoc(ops);
-    });
-
-    it("sets height and width for images with no height and width", async () => {
-      const image = doc.getElementById("image-with-no-dimensions");
-      expect(image).toBeTruthy();
-      expect(image.hasAttribute("height")).toBeTruthy();
-      expect(image.hasAttribute("width")).toBeTruthy();
-      expect(image.height).toBe(3);
-      expect(image.width).toBe(5);
-    });
-    it("doesn't change height and width for images with both height and width", async () => {
-      const image = doc.getElementById("image-with-dimensions");
-      expect(image).toBeTruthy();
-      expect(image.hasAttribute("height")).toBeTruthy();
-      expect(image.hasAttribute("width")).toBeTruthy();
-      expect(image.height).toBe(100);
-      expect(image.width).toBe(200);
-    });
-    it("doesn't change height and width for images with height only", async () => {
-      const image = doc.getElementById("image-with-height-only");
-      expect(image).toBeTruthy();
-      expect(image.hasAttribute("height")).toBeTruthy();
-      expect(image.hasAttribute("width")).toBeFalsy();
-      expect(image.height).toBe(100);
-    });
-    it("doesn't change height and width for images with width only", async () => {
-      const image = doc.getElementById("image-with-width-only");
-      expect(image).toBeTruthy();
-      expect(image.hasAttribute("height")).toBeFalsy();
-      expect(image.hasAttribute("width")).toBeTruthy();
-      expect(image.width).toBe(200);
-    });
-    it("doesn't change height and width for images with srcset", async () => {
-      const image = doc.getElementById("image-with-srcset");
-      expect(image).toBeTruthy();
-      expect(image.hasAttribute("srcset")).toBeTruthy();
-      expect(image.hasAttribute("height")).toBeFalsy();
-      expect(image.hasAttribute("width")).toBeFalsy();
-      expect(image.srcset).toBe(imgDataURL);
-    });
-    it("doesn't change height and width for images inside picture", async () => {
-      const image = doc.getElementById("image-inside-picture");
-      expect(image).toBeTruthy();
-      expect(image.hasAttribute("height")).toBeFalsy();
-      expect(image.hasAttribute("width")).toBeFalsy();
-    });
-
-    it("doesn't set height or width to SVG images", async () => {
-      const imageSvgUrl = doc.getElementById("image-svg-url");
-      expect(imageSvgUrl).toBeTruthy();
-      expect(imageSvgUrl.hasAttribute("height")).toBeFalsy();
-      expect(imageSvgUrl.hasAttribute("width")).toBeFalsy();
-
-      const imageSvgDataUri = doc.getElementById("image-svg-data-uri");
-      expect(imageSvgDataUri).toBeTruthy();
-      expect(imageSvgDataUri.hasAttribute("height")).toBeFalsy();
-      expect(imageSvgDataUri.hasAttribute("width")).toBeFalsy();
-    });
-  });
   it("localizes list of figures", async () => {
     const ops = {
       config: makeBasicConfig(),