Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

[p5.js 2.0+ Bug Report]: SVG importer does not respect preserveAspectRatio="none" for <symbol>/<use>

Chiusa Adatta ai principianti
#9,257 2 commenti 0 reazioni 1 assegnatario Vedi su GitHub

I maintainer di solito rispondono entro 2 giorni

@Danyccsf ci sta già lavorando.

Dal 8/10/2026.

  • #9261 di @Danyccsf — aperta

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
83/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
javascript

Direzione di ricerca

Inizia con la suite di test degli elementi <defs> e <use> in test/unit/svg/svg_import.js ed esegui npm test -- test/unit/svg/svg_import.js per confermare il fallimento. Segui come l’importatore SVG gestisce preserveAspectRatio per un simbolo referenziato da <use>. Il lavoro è completato quando il test di regressione passa con una trasformazione orizzontale pari a 2 e una trasformazione verticale pari a 1.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Area:Core p5.js 2.0+
Most appropriate sub-area of p5.js?
  • Accessibility
  • Color
  • Core/Environment/Rendering
  • Data
  • DOM
  • Events
  • Image
  • IO
  • Math
  • Typography
  • Utilities
  • WebGL
  • WebGPU
  • p5.strands
  • Build process
  • Unit testing
  • Internationalization
  • Friendly errors
  • Other (specify if possible)
p5.js version

2.3.2

Web browser and version

No response

Operating system

macOS 15.7.3

Steps to reproduce this
Steps:
  1. Add the regression test below to the <defs> and <use> elements suite in test/unit/svg/svg_import.js.
  2. Run npm test -- test/unit/svg/svg_import.js.
  3. Observe that the test fails because node.state.transform.a is 1 instead of the expected 2.

The test uses a 100×100 <symbol> with preserveAspectRatio="none" inside a 200×100 <use> viewport. In this case, the expected transform is non-uniform scaling: 2× horizontally and 1× vertically.

I reproduced this on p5.js 2.3.2 (main at 7f9e0fda5). The SVG importer test suite reports 92 passing tests and this test failing with:

AssertionError: expected 1 to be close to 2 +/- 0.001

Snippet:
test('use respects preserveAspectRatio=none', function () {
  const record = createSVG(`
    <svg xmlns="http://www.w3.org/2000/svg">
      <defs>
        <symbol id="stretch" viewBox="0 0 100 100" preserveAspectRatio="none">
          <rect x="0" y="0" width="100" height="100" />
        </symbol>
      </defs>
      <use href="#stretch" width="200" height="100" />
    </svg>
  `);

  const scope = firstChild(record);
  const node = scope.children[0];

  assert.closeTo(node.state.transform.a, 2, 0.001);
  assert.closeTo(node.state.transform.d, 1, 0.001);
});
Lingua principale
JavaScript
Stelle
24.1k
Fork
3.9k
Merge medio
3g 4h
PR unite (30g)
27

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di processing/p5.js

Tutte le issue di processing/p5.js

Issue simili

Altre issue su JavaScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.