Skip to content

Dashicon to SVG Icon substitutions - #85510

Draft
peterwilsoncc wants to merge 2 commits into
trunkfrom
icon-substitutions
Draft

Dashicon to SVG Icon substitutions#85510
peterwilsoncc wants to merge 2 commits into
trunkfrom
icon-substitutions

Conversation

@peterwilsoncc

@peterwilsoncc peterwilsoncc commented Oct 25, 2026

Copy link
Copy Markdown
Contributor

What?

Begins work on creating a dictionary of old dashicon class names to their new SVG icon package replacement.

Closes

Why?

It's relatively common that dashicons will be used for the icon of a post type (a code CPT might will use dashicon-code, etc). It's possible to infer the correct substitution for many of these so it would be wise to do so in order that the new icons just work for existing CPTs.

This is a start on this but I need help with some of the decisions.

I've logged the existing substitutions here https://peterwilson.cc/content/dashicon-subs.html

How?

Adds a property to the icon manifest with the name of the dashicon equivalent.

Todo:

  • Function to get icon by dashicon name
  • Figure out remaining substitutions
  • Determine if this is the best approach or whether there should be a simpler mapping of a function listing the old to the new.

Testing Instructions

Testing Instructions for Keyboard

Screenshots or screencast

Before After

Use of AI Tools

  • Claude Opus Medium 5.5
  • Initial prompt:

    In packages/icons/src/manifest.json I want to add a new property to each entry with the name "legacyDashicon".

    The value is to contain class of the dashicon that the new icon replaces. The class name takes the form dashicons-<legacy-icon-name>

    You may review the history of this repository and WordPress/WordPress-Develop to determin the replacement.

    A directory of icons can be found at https://wordpress.github.io/gutenberg/?path=/story/icons-icon--library

    A directory of dashicons can be fount at https://developer.wordpress.org/resource/dashicons/

    Be conservative with your assumptions about which icon replaces the dashicon. Make as few assumptions as possible.

@github-actions

github-actions Bot commented Oct 25, 2026 •
edited
Loading

Copy link
Copy Markdown

🤖 PR meta 🤖

Preview in WordPress Playground

⚡ Performance

Show the results

Client side metrics exclude the server response time.

front-end-block-theme

Metric 00eb8f4 trunk % Change
timeToFirstByte 34.4 ms +3.78% -2.76% 34.95 ms +15.31% -6.87% -1.57%
largestContentfulPaint 60 ms +3.33% -3.33% 62 ms +3.23% -3.23% -3.23%
lcpMinusTtfb 25.35 ms +9.86% -6.71% 25.05 ms +9.58% -4.79% 1.2%
wpBeforeTemplate 18.1 ms +10.06% -1.49% 18.31 ms +21.25% -3.71% -1.15%
wpTemplate 12.65 ms +5.45% -4.58% 13.31 ms +10.14% -9.69% -4.96%
wpTotal 31.39 ms +4.3% -2.58% 31.76 ms +15.21% -6.61% -1.16%
wpMemoryUsage 7.68 MB +0% -0% 7.65 MB +0% -0% 0.42%
wpDbQueries 16 +0% -0% 16 +0% -0% 0%

front-end-classic-theme

Metric 00eb8f4 trunk % Change
timeToFirstByte 28.6 ms +6.99% -0.52% 26 ms +13.65% -1.54% 10%
largestContentfulPaint 68 ms +0% -0% 60 ms +6.67% -0% 13.33%
lcpMinusTtfb 39.4 ms +0.38% -2.28% 34.4 ms +3.92% -0.87% 14.53%
wpBeforeTemplate 16.35 ms +3.24% -1.35% 16.29 ms +11.6% -1.96% 0.37%
wpTemplate 9.84 ms +4.78% -2.34% 7.48 ms +5.35% -2.01% 31.55%
wpTotal 26.27 ms +6.7% -0.95% 23.68 ms +14.95% -1.77% 10.94%
wpMemoryUsage 6.37 MB +0% -0% 6.22 MB +0% -0% 2.33%
wpDbQueries 13 +0% -0% 9 +0% -0% 44.44%

media-processing

Metric 00eb8f4 trunk % Change
mediaProcessingJpeg 222.88 ms +1.88% -0.61% 225.07 ms +1.72% -1.4% -0.97%
mediaProcessingAvif 3619.95 ms +0.78% -0.67% 3730.05 ms +0.55% -0.19% -2.95%
mediaProcessingJpegToAvif 2507.84 ms +1.37% -0.2% 2554.82 ms +1.31% -0.16% -1.84%

media-upload

Metric 00eb8f4 trunk % Change
jpegUploadProcessing 1394.76 ms +0.9% -27.62% 1147.93 ms +22.81% -21.08% 21.5%
pngUploadProcessing 169.86 ms +10.34% -5.83% 161.67 ms +6.27% -1.26% 5.07%
largeJpegUploadProcessing 1390.22 ms +1.09% -34.09% 1385.27 ms +0.3% -32.95% 0.36%
multipleImageUploadProcessing 1470.41 ms +1.19% -8.09% 1502.71 ms +0.7% -3.13% -2.15%

post-editor

Metric 00eb8f4 trunk % Change
serverResponse 499.28 ms +8.45% -1.82% 482.19 ms +7.3% -1.84% 3.54%
firstPaint 432.41 ms +19.02% -37.78% 503.85 ms +1.41% -37.16% -14.18%
domContentLoaded 1225.84 ms +1.25% -3.21% 1231.28 ms +0.5% -2.36% -0.44%
loaded 1227.15 ms +1.31% -3.21% 1232.7 ms +0.48% -2.35% -0.45%
firstContentfulPaint 499.56 ms +7.45% -14.07% 516.23 ms +4.66% -2% -3.23%
firstBlock 3507.64 ms +4.85% -1.24% 3483.44 ms +4.14% -1.74% 0.69%
type 18.22 ms +2.58% -5.05% 17.41 ms +12% -2.41% 4.65%
typeWithoutInspector 18.68 ms +5.19% -6.96% 17.18 ms +6.93% -1.69% 8.73%
typeWithTopToolbar 25.33 ms +5.65% -12% 23.14 ms +1.43% -6.27% 9.46%
typeContainer 8.75 ms +9.26% -7.54% 8.67 ms +13.26% -12.11% 0.92%
focus 119.32 ms +6.08% -2.41% 118.87 ms +8% -2.42% 0.38%
firstFocus 237.43 ms +0% -0% 293.32 ms +0% -0% -19.05%
selectAll 594.61 ms +0.62% -5.59% 584.87 ms +3.72% -5.04% 1.67%
listViewOpen 80.62 ms +9.82% -8.1% 80.27 ms +8.97% -5.39% 0.44%
inserterOpen 44.55 ms +23.55% -12.28% 44.62 ms +1.61% -6.72% -0.16%
inserterHover 12.36 ms +10.44% -13.92% 11.11 ms +17.91% -9.27% 11.25%
inserterSearch 8.33 ms +11.28% -7.68% 7.99 ms +10.26% -8.64% 4.26%
loadPatterns 652.39 ms +5.01% -5.45% 616.27 ms +2.83% -2.73% 5.86%
wpTotal 489.82 ms +8.57% -1.95% 471.96 ms +7.69% -1.88% 3.78%
wpMemoryUsage 14.71 MB +0% -0% 14.68 MB +0% -0% 0.24%
wpDbQueries 55 +0% -1.82% 55 +0% -1.82% 0%

site-editor

Metric 00eb8f4 trunk % Change
serverResponse 502.93 ms +1.99% -6.12% 502.06 ms +2.57% -3.66% 0.17%
firstPaint 276.8 ms +10.37% -7.14% 273.61 ms +8.81% -9.95% 1.17%
domContentLoaded 1278.88 ms +0.66% -1.5% 1271.81 ms +0.7% -1.38% 0.56%
loaded 1280.09 ms +0.64% -1.51% 1272.92 ms +0.69% -1.39% 0.56%
firstContentfulPaint 517.8 ms +4.21% -3.11% 513.09 ms +1.25% -1.6% 0.92%
firstBlock 4612.76 ms +0.76% -1.79% 4520.58 ms +0.45% -0.41% 2.04%
type 17.66 ms +8.04% -3.79% 17.44 ms +10.44% -3.61% 1.26%
navigate 120.03 ms +12.76% -4.62% 119.02 ms +3.26% -6.24% 0.85%
loadPatterns 1264.74 ms +1.68% -10.77% 1279.58 ms +2.89% -6.69% -1.16%
loadPages 980.22 ms +4.49% -2.48% 992.64 ms +2.03% -4.04% -1.25%
wpTotal 493.66 ms +2.09% -6.17% 492.67 ms +2.65% -3.84% 0.2%
wpMemoryUsage 12.73 MB +0% -0% 12.70 MB +0% -0% 0.24%
wpDbQueries 44 +2.27% -0% 44 +2.27% -0% 0%

f8a6b0b Run

🏁 Flaky tests

Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

As a user I want to set button hover background color and see it applied on the frontend (Site Editor v2) in /test/e2e/specs/site-editor/global-styles-button-states.spec.js, passed after 1 failed attempt. 
Error: apiRequestContext.get: socket hang up
Call log:
  - → GET http://localhost:8889/wp-admin/themes.php
    - user-agent: Playwright/1.63.0 (x64; ubuntu 24.04) node/24.20 CI/1
    - accept: */*
    - accept-encoding: gzip,deflate,br
    - cookie: wordpress_test_cookie=WP%20Cookie%20check; wordpress_23778236db82f19306f247e20a353a99=admin%7C1793060093%7CSBRibbtqdCOIJ2wjsVfV66BBOqYK9Ha5UXSydjKuZNk%7Ce3b981905dcb8bac05dce5065180d3865ecb17a628cfa13b7d9799a47bff53bc; wordpress_logged_in_23778236db82f19306f247e20a353a99=admin%7C1793060093%7CSBRibbtqdCOIJ2wjsVfV66BBOqYK9Ha5UXSydjKuZNk%7C54778d5fa85b246fff69873d75f6c257d9b10a96d0f6c2bc9d194db9c038ae22; wp-settings-time-1=1792887396

    at RequestUtils.activateTheme (/home/runner/work/gutenberg/gutenberg/packages/e2e-test-utils-playwright/src/request-utils/themes.ts:7:36)
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/site-editor/global-styles-button-states.spec.js:5:22
Custom Completer: should allow newlines after multiple option completions in /test/e2e/specs/editor/various/autocomplete-and-mentions.spec.js, passed after 1 failed attempt. 
Error: expect(received).toBe(expected) // Object.is equality

- Expected  - 1
+ Received  + 1

@@ -5,11 +5,11 @@
  <!-- wp:paragraph -->
  <p>🫐 test</p>
  <!-- /wp:paragraph -->

  <!-- wp:paragraph -->
- <p>🫐 test</p>
+ <p>~🍎 test</p>
  <!-- /wp:paragraph -->

  <!-- wp:paragraph -->
  <p>🫐 test</p>
  <!-- /wp:paragraph -->

Call Log:
- Timeout 5000ms exceeded while waiting on the predicate
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/various/autocomplete-and-mentions.spec.js:466:6
Custom Completer: should insert option between two other words in /test/e2e/specs/editor/various/autocomplete-and-mentions.spec.js, passed after 2 failed attempts. 
Error: apiRequestContext.fetch: socket hang up
Call log:
  - → DELETE http://localhost:8889/wp-json/wp/v2/users/25?force=true&reassign=1
    - user-agent: Playwright/1.63.0 (x64; ubuntu 24.04) node/24.20 CI/1
    - accept: */*
    - accept-encoding: gzip,deflate,br
    - X-WP-Nonce: 6f503b0c6f
    - cookie: wordpress_test_cookie=WP%20Cookie%20check; wordpress_logged_in_23778236db82f19306f247e20a353a99=admin%7C1793060136%7CtvEErkLEVUPy3cufGtjKyPQoQRULvWnecsnPLlMFc4N%7C866a347055838e815714dbbc19640f225d019051c1c4ab1f06dbaeaa4c0e21b7; wp-settings-time-1=1792888045

    at RequestUtils.rest (/home/runner/work/gutenberg/gutenberg/packages/e2e-test-utils-playwright/src/request-utils/rest.ts:111:39)
    at RequestUtils.deleteUser (/home/runner/work/gutenberg/gutenberg/packages/e2e-test-utils-playwright/src/request-utils/users.ts:91:30)
    at map (/home/runner/work/gutenberg/gutenberg/packages/e2e-test-utils-playwright/src/request-utils/users.ts:116:51)
    at RequestUtils.deleteAllUsers (/home/runner/work/gutenberg/gutenberg/packages/e2e-test-utils-playwright/src/request-utils/users.ts:116:5)
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/various/autocomplete-and-mentions.spec.js:73:3

allows widgets to be moved between widget areas using the dropdown in the block toolbar in /test/e2e/specs/widgets/editing-widgets.spec.js, passed after 1 failed attempt.

can apply custom gradient background color in /test/e2e/specs/editor/blocks/buttons.spec.js, passed after 1 failed attempt. 
Error: expect(received).toBe(expected) // Object.is equality

- Expected  - 1
+ Received  + 1

  <!-- wp:buttons -->
- <div class="wp-block-buttons"><!-- wp:button {"style":{"background":{"gradient":"linear-gradient(135deg,rgb(255,0,0) 0%,rgb(0,255,0) 100%)"}}} -->
+ <div class="wp-block-buttons"><!-- wp:button {"style":{"background":{"gradient":"linear-gradient(135deg,rgb(6,147,227) 0%,rgb(0,255,0) 100%)"}}} -->
  <div class="wp-block-button"><a class="wp-block-button__link wp-element-button">Content</a></div>
  <!-- /wp:button --></div>
  <!-- /wp:buttons -->
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/blocks/buttons.spec.js:411:21
should cut and paste individual blocks with collapsed selection in /test/e2e/specs/editor/various/copy-cut-paste.spec.js, passed after 1 failed attempt. 
Error: expect(string).toMatchSnapshot(expected) failed

  @@ -1,3 +1,3 @@
   <!-- wp:paragraph -->
  -<p>2Cut - collapsed selection</p>
  +<p>2</p>
   <!-- /wp:paragraph -->


    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/various/copy-cut-paste.spec.js:45:49
should format text across blocks in /test/e2e/specs/editor/various/multi-block-selection.spec.js, passed after 1 failed attempt. 
Error: expect(received).toMatchObject(expected)

- Expected  - 1
+ Received  + 1

@@ -1,9 +1,9 @@
  Array [
    Object {
      "attributes": Object {
-       "content": "ab",
+       "content": "b",
      },
      "name": "core/paragraph",
    },
    Object {
      "attributes": Object {

Call Log:
- Timeout 5000ms exceeded while waiting on the predicate
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/various/multi-block-selection.spec.js:2170:41
should insert a line break on shift+enter in /test/e2e/specs/editor/blocks/list.spec.js, passed after 1 failed attempt. 
Error: expect(received).toBe(expected) // Object.is equality

- Expected  - 1
+ Received  + 1

  <!-- wp:list -->
  <ul class="wp-block-list"><!-- wp:list-item -->
- <li>a<br></li>
+ <li></li>
  <!-- /wp:list-item --></ul>
  <!-- /wp:list -->

Call Log:
- Timeout 5000ms exceeded while waiting on the predicate
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/blocks/list.spec.js:1210:52
should merge a following sibling list into the outermost list with Delete from a nested item (#77245) in /test/e2e/specs/editor/blocks/list.spec.js, passed after 1 failed attempt. 
Error: expect(received).toMatchObject(expected)

- Expected  - 2
+ Received  + 2

@@ -8,11 +8,11 @@
          "innerBlocks": Array [
            Object {
              "innerBlocks": Array [
                Object {
                  "attributes": Object {
-                   "content": "b‸",
+                   "content": "b",
                  },
                  "name": "core/list-item",
                },
              ],
              "name": "core/list",
@@ -25,11 +25,11 @@
    },
    Object {
      "innerBlocks": Array [
        Object {
          "attributes": Object {
-           "content": "1",
+           "content": "‸1",
          },
          "innerBlocks": Array [
            Object {
              "innerBlocks": Array [
                Object {

Call Log:
- Timeout 5000ms exceeded while waiting on the predicate
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/blocks/list.spec.js:2854:41
should replace the selection across blocks with an inline image in /test/e2e/specs/editor/various/multi-block-selection.spec.js, passed after 1 failed attempt. 
Error: expect(received).toMatchObject(expected)

- Expected  - 6
+ Received  + 2

  Array [
    Object {
      "attributes": Object {
        "content": "ab",
+       "dropCap": false,
      },
-     "name": "core/paragraph",
-   },
-   Object {
-     "attributes": Object {
-       "content": "ab",
-     },
+     "innerBlocks": Array [],
      "name": "core/paragraph",
    },
  ]

Call Log:
- Timeout 5000ms exceeded while waiting on the predicate
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/various/multi-block-selection.spec.js:2372:41
should split indented list item in /test/e2e/specs/editor/blocks/list.spec.js, passed after 1 failed attempt. 
Error: expect(received).toBe(expected) // Object.is equality

- Expected  - 1
+ Received  + 1

@@ -1,8 +1,8 @@
  <!-- wp:list -->
  <ul class="wp-block-list"><!-- wp:list-item -->
- <li>one<!-- wp:list -->
+ <li>ne<!-- wp:list -->
  <ul class="wp-block-list"><!-- wp:list-item -->
  <li>two</li>
  <!-- /wp:list-item -->

  <!-- wp:list-item -->

Call Log:
- Timeout 5000ms exceeded while waiting on the predicate
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/blocks/list.spec.js:668:52
should update the URL from the last navigation if only varies in the URL fragment in /test/e2e/specs/interactivity/router-navigate.spec.ts, passed after 1 failed attempt. 
Error: expect(locator).toHaveText(expected) failed

Locator:  getByTestId('title')
Expected: "Link 1"
Received: "Main"
Timeout:  5000ms

Call log:
  - Expect "toHaveText" getByTestId('title') with timeout 5000ms
  - waiting for getByTestId('title')
    14 × locator resolved to <h2 data-testid="title">Main</h2>
       - unexpected value "Main"

    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/interactivity/router-navigate.spec.ts:160:25
shows title and sync status while creating a new synced pattern in the post editor in /test/e2e/specs/editor/various/post-summary/post-summary.spec.js, passed after 1 failed attempt. 
Error: expect(locator).toBeVisible() failed

Locator: getByRole('dialog', { name: 'Create pattern' })
Expected: visible
Timeout: 5000ms
Error: element(s) not found

Call log:
  - Expect "toBeVisible" getByRole('dialog', { name: 'Create pattern' }) with timeout 5000ms
  - waiting for getByRole('dialog', { name: 'Create pattern' })

    at createPatternFromModal (/home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/various/post-summary/post-summary.spec.js:179:26)
    at /home/runner/work/gutenberg/gutenberg/test/e2e/specs/editor/various/post-summary/post-summary.spec.js:101:4

f8a6b0b Run

@github-actions github-actions Bot added the [Package] Icons /packages/icons label Oct 25, 2026
@peterwilsoncc peterwilsoncc added [Type] Bug An existing feature does not function as intended Backwards Compatibility Issues or PRs that impact backwards compatability labels Oct 25, 2026

This branch has not been deployed

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

Reviewers

No reviews

Assignees

No one assigned

Labels

Backwards Compatibility Issues or PRs that impact backwards compatability [Package] Icons /packages/icons [Type] Bug An existing feature does not function as intended

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@peterwilsoncc