Skip to content

[Snyk] Upgrade p5 from 2.0.3 to 2.1.1#56

Open
NaveenDA wants to merge 1 commit into
mainfrom
snyk-upgrade-516bd61a1f22c035c655e1ebed7c8f6c
Open

[Snyk] Upgrade p5 from 2.0.3 to 2.1.1#56
NaveenDA wants to merge 1 commit into
mainfrom
snyk-upgrade-516bd61a1f22c035c655e1ebed7c8f6c

Conversation

@NaveenDA
Copy link
Copy Markdown
Owner

@NaveenDA NaveenDA commented Dec 6, 2025

snyk-top-banner

Snyk has created this PR to upgrade p5 from 2.0.3 to 2.1.1.

ℹ️ Keep your dependencies up-to-date. This makes it easier to fix existing vulnerabilities and to more quickly identify and fix newly disclosed vulnerabilities when they affect your project.


  • The recommended version is 13 versions ahead of your current version.

  • The recommended version was released 25 days ago.

Release notes
Package name: p5
  • 2.1.1 - 2025-11-10

    Use this link to load the library: https://cdn.jsdelivr.net/npm/p5@2.1.1/lib/p5.js

    What's new in p5.js 2.1 🌱

    let bgColor, fg1Color, fg2Color, msg1, msg2;
    function setup() {
    createCanvas(100, 100);
    bgColor = color(0);
    fg1Color = color(100);
    fg2Color = color(220);

     <span class="pl-k">if</span><span class="pl-kos">(</span><span class="pl-s1">bgColor</span><span class="pl-kos">.</span><span class="pl-en">contrast</span><span class="pl-kos">(</span><span class="pl-s1">fg1Color</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
       <span class="pl-s1">msg1</span> <span class="pl-c1">=</span> <span class="pl-s">'good'</span><span class="pl-kos">;</span>
     <span class="pl-kos">}</span><span class="pl-k">else</span><span class="pl-kos">{</span>
       <span class="pl-s1">msg1</span> <span class="pl-c1">=</span> <span class="pl-s">'bad'</span><span class="pl-kos">;</span>
     <span class="pl-kos">}</span>
    
     <span class="pl-k">if</span><span class="pl-kos">(</span><span class="pl-s1">bgColor</span><span class="pl-kos">.</span><span class="pl-en">contrast</span><span class="pl-kos">(</span><span class="pl-s1">fg2Color</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
       <span class="pl-s1">msg2</span> <span class="pl-c1">=</span> <span class="pl-s">'good'</span><span class="pl-kos">;</span>
     <span class="pl-kos">}</span><span class="pl-k">else</span><span class="pl-kos">{</span>
       <span class="pl-s1">msg2</span> <span class="pl-c1">=</span> <span class="pl-s">'bad'</span><span class="pl-kos">;</span>
     <span class="pl-kos">}</span>
    
     <span class="pl-en">describe</span><span class="pl-kos">(</span><span class="pl-s">'A black canvas with a faint grey word saying "bad" at the top left and a brighter light grey word saying "good" in the middle of the canvas.'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    

    }

    function draw(){
    background(bgColor);

     <span class="pl-en">textSize</span><span class="pl-kos">(</span><span class="pl-c1">18</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    
     <span class="pl-en">fill</span><span class="pl-kos">(</span><span class="pl-s1">fg1Color</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
     <span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-s1">msg1</span><span class="pl-kos">,</span> <span class="pl-c1">10</span><span class="pl-kos">,</span> <span class="pl-c1">30</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    
     <span class="pl-en">fill</span><span class="pl-kos">(</span><span class="pl-s1">fg2Color</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
     <span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-s1">msg2</span><span class="pl-kos">,</span> <span class="pl-c1">10</span><span class="pl-kos">,</span> <span class="pl-c1">60</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    

    }

    oneColor.contrast(anotherColor) checks the contrast between two colors. This method returns a boolean value to indicate if the two color has enough contrast. true means that the colors has enough contrast to be used as background color and body text color. false means there is not enough contrast.

    A second argument can be passed to the method, options , which defines the algorithm to be used. The algorithms currently supported are WCAG 2.1 ('WCAG21') or APCA ('APCA'). The default is WCAG 2.1. If a value of 'all' is passed to the options argument, an object containing more details is returned. The details object will include the calculated contrast value of the colors and different passing criteria.

    let bgColor, fgColor, contrast;
    function setup() {
    createCanvas(100, 100);
    bgColor = color(0);
    fgColor = color(200);
    contrast = bgColor.contrast(fgColor, 'all');

     <span class="pl-en">describe</span><span class="pl-kos">(</span><span class="pl-s">'A black canvas with four short lines of grey text that respectively says: "WCAG 2.1", "12.55", "APCA", and "-73.30".'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    

    }

    function draw(){
    background(bgColor);

     <span class="pl-en">textSize</span><span class="pl-kos">(</span><span class="pl-c1">14</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    
     <span class="pl-en">fill</span><span class="pl-kos">(</span><span class="pl-s1">fgColor</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
     <span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-s">'WCAG 2.1'</span><span class="pl-kos">,</span> <span class="pl-c1">10</span><span class="pl-kos">,</span> <span class="pl-c1">25</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
     <span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-en">nf</span><span class="pl-kos">(</span><span class="pl-s1">contrast</span><span class="pl-kos">.</span><span class="pl-c1">WCAG21</span><span class="pl-kos">.</span><span class="pl-c1">value</span><span class="pl-kos">,</span> <span class="pl-c1">0</span><span class="pl-kos">,</span> <span class="pl-c1">2</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-c1">10</span><span class="pl-kos">,</span> <span class="pl-c1">40</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    
     <span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-s">'APCA'</span><span class="pl-kos">,</span> <span class="pl-c1">10</span><span class="pl-kos">,</span> <span class="pl-c1">70</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
     <span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-en">nf</span><span class="pl-kos">(</span><span class="pl-s1">contrast</span><span class="pl-kos">.</span><span class="pl-c1">APCA</span><span class="pl-kos">.</span><span class="pl-c1">value</span><span class="pl-kos">,</span> <span class="pl-c1">0</span><span class="pl-kos">,</span> <span class="pl-c1">2</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-c1">10</span><span class="pl-kos">,</span> <span class="pl-c1">85</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    

    }

    For more details about color contrast, you can check out this page from color.js, and the WebAIM color contrast checker.

    Changes since 2.0 🎊

Snyk has created this PR to upgrade p5 from 2.0.3 to 2.1.1.

See this package in npm:
p5

See this project in Snyk:
https://app.snyk.io/org/naveenda/project/304cb0f0-f33c-4cd0-b6d0-bee73f70d410?utm_source=github&utm_medium=referral&page=upgrade-pr
Copilot AI review requested due to automatic review settings December 6, 2025 04:24
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR upgrades the p5.js library from version 2.0.3 to 2.1.1, a minor version update that includes new features like TypeScript integration, p5.strands branching/looping, Addon Events API, and color contrast checking functionality. The upgrade was initiated by Snyk and is 13 versions ahead of the current version.

  • Updated p5 dependency from ^2.0.3 to ^2.1.1
  • Updated transitive dependency requirements (including zod from ^3.23.8 to ^3.25.51)

Reviewed changes

Copilot reviewed 1 out of 2 changed files in this pull request and generated no comments.

File Description
package.json Updates p5 version from ^2.0.3 to ^2.1.1
package-lock.json Updates resolved p5 version to 2.1.1, updates transitive dependencies including zod to 3.25.67, and reflects changes to peer dependency markers for several unrelated packages

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants