Merge pull request #379 from marp-team/drop-deprecated-color-syntax-s…

…upport [v3] Removed color setting shorthand via Markdown image syntax
marp-team · Oct 28, 2023 · 325effe · 325effe
2 parents 56d7f44 + 6590633
commit 325effe
Show file tree

Hide file tree

Showing 8 changed files with 6 additions and 183 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,10 @@
 
 ## [Unreleased]
 
+### Removed
+
+- Deprecated color setting shorthand via Markdown image syntax ([#331](https://github.com/marp-team/marpit/issues/331), [#379](https://github.com/marp-team/marpit/pull/379))
+
 ## v2.6.1 - 2023-10-15
 
 ### Fixed

diff --git a/package.json b/package.json
@@ -87,7 +87,6 @@
     "ws": "^8.14.2"
   },
   "dependencies": {
-    "color-string": "^1.9.1",
     "cssesc": "^3.0.0",
     "js-yaml": "^4.1.0",
     "lodash.kebabcase": "^4.1.1",

diff --git a/src/markdown/image/apply.js b/src/markdown/image/apply.js
@@ -36,38 +36,6 @@ function _applyImage(md) {
       }
     }
   })
-
-  // [DEPRECATED] Shorthand for color spot directive
-  md.core.ruler.after(
-    'marpit_inline_svg',
-    'marpit_apply_color',
-    ({ inlineMode, tokens }) => {
-      if (inlineMode) return
-
-      let current
-
-      for (const t of tokens) {
-        if (t.type === 'marpit_slide_open') current = t
-        if (t.type === 'marpit_slide_close') current = undefined
-
-        // Collect parsed inline image meta
-        if (current && t.type === 'inline') {
-          for (const tc of t.children) {
-            if (tc.type === 'image') {
-              const { background, color } = tc.meta.marpitImage
-
-              if (!background && color) {
-                current.meta.marpitDirectives = {
-                  ...(current.meta.marpitDirectives || {}),
-                  color,
-                }
-              }
-            }
-          }
-        }
-      }
-    },
-  )
 }
 
 export const applyImage = marpitPlugin(_applyImage)

diff --git a/src/markdown/image/parse.js b/src/markdown/image/parse.js
@@ -1,5 +1,4 @@
 /** @module */
-import colorString from 'color-string'
 import marpitPlugin from '../../plugin'
 
 const escape = (target) =>
@@ -93,17 +92,9 @@ optionMatchers.set(/^sepia(?::(.+))?$/, (matches, meta) => ({
 function _parseImage(md) {
   const { process } = md.core
 
-  // Store original URL, for the color shorthand.
-  // (Avoid a side effect from link normalization)
-  let originalURLMap
   let refCount = 0
 
   const finalizeTokenAttr = (token, state) => {
-    // Convert imprimitive attribute value into primitive string
-    if (token.attrs && Array.isArray(token.attrs)) {
-      token.attrs = token.attrs.map(([name, value]) => [name, value.toString()])
-    }
-
     // Apply finalization recursively to inline tokens
     if (token.type === 'inline') {
       for (const t of token.children) finalizeTokenAttr(t, state)
@@ -132,24 +123,12 @@ function _parseImage(md) {
   }
 
   md.core.process = (state) => {
-    const { normalizeLink } = md
-
-    // Prevent reset of WeakMap caused by calling core process internally
-    if (refCount === 0) originalURLMap = new WeakMap()
-
     try {
-      md.normalizeLink = (url) => {
-        const imprimitiveUrl = new String(normalizeLink.call(md, url))
-        originalURLMap.set(imprimitiveUrl, url)
-
-        return imprimitiveUrl
-      }
-
       refCount += 1
+
       return process.call(md.core, state)
     } finally {
       refCount -= 1
-      md.normalizeLink = normalizeLink
 
       if (refCount === 0) {
         // Apply finalization for every tokens
@@ -186,9 +165,6 @@ function _parseImage(md) {
         }, [])
 
         const url = token.attrGet('src')
-        const originalUrl = originalURLMap.has(url)
-          ? originalURLMap.get(url)
-          : url
 
         token.meta = token.meta || {}
         token.meta.marpitImage = {
@@ -197,24 +173,6 @@ function _parseImage(md) {
           options,
         }
 
-        // [DEPRECATED]
-        // Detect shorthand for setting color (Use value before normalization)
-        if (
-          !!colorString.get(originalUrl) ||
-          originalUrl.toLowerCase() === 'currentcolor'
-        ) {
-          const replacedDirective = options.some((opt) => opt.content === 'bg')
-            ? 'backgroundColor'
-            : 'color'
-
-          console.warn(
-            `Deprecation warning: Shorthand for setting colors via Markdown image syntax is deprecated now, and will remove in next major release. Please replace to a scoped local direcitve <!-- _${replacedDirective}: "${originalUrl}" -->, or use the scoped style <style scoped>.`,
-          )
-
-          token.meta.marpitImage.color = originalUrl
-          token.hidden = true
-        }
-
         // Parse keyword through matchers
         for (const opt of options) {
           for (const [regexp, mergeFunc] of optionMatchers) {

diff --git a/test/markdown/background_image.js b/test/markdown/background_image.js
@@ -81,22 +81,6 @@ describe('Marpit background image plugin', () => {
     })
   })
 
-  context('with color keyword', () => {
-    it('assigns backgroundColor directive', () => {
-      const bgColorDirective = (src) => {
-        const [firstSlide] = md().parse(`![bg](${src})`)
-        return firstSlide.meta.marpitDirectives.backgroundColor
-      }
-
-      expect(bgColorDirective('#123abc')).toBe('#123abc')
-      expect(bgColorDirective('#def')).toBe('#def')
-      expect(bgColorDirective('transparent')).toBe('transparent')
-      expect(bgColorDirective('currentColor')).toBe('currentColor')
-      expect(bgColorDirective('rgb(255,128,0)')).toBe('rgb(255,128,0)')
-      expect(bgColorDirective('rgba(16,32,64,0.5)')).toBe('rgba(16,32,64,0.5)')
-    })
-  })
-
   context('with resizing keyword / scale', () => {
     const directives = (markdown) => {
       const [parsed] = md().parse(markdown)
@@ -489,18 +473,5 @@ describe('Marpit background image plugin', () => {
         expect(pseudoSection.attr('style')).toContain('color:white;')
       })
     })
-
-    context('with background color definition', () => {
-      const $ = $load(mdSVG().render('![bg](red) ![bg](test)'))
-      const bgSection = $(
-        'section[data-marpit-advanced-background="background"]',
-      )
-
-      it('assigns backgroundColor style to background layer', () =>
-        expect(bgSection.attr('style')).toContain('background-color:red;'))
-
-      it('renders only one figure image', () =>
-        expect(bgSection.find('figure')).toHaveLength(1))
-    })
   })
 })
diff --git a/test/markdown/image.js b/test/markdown/image.js
@@ -108,28 +108,4 @@ describe('Marpit image plugin', () => {
       expect($('img').attr('alt')).toBe('This is  example\timage')
     })
   })
-
-  describe('[DEPRECATED] Shorthand for text color', () => {
-    const colorMd = (src, opts = '') => `![${opts}](${src})`
-    const colorDirective = (markdown) => {
-      const [firstSlide] = md().parse(markdown)
-      return firstSlide.meta.marpitDirectives.color
-    }
-
-    it('assigns color directive', () => {
-      expect(colorDirective(colorMd('#123abc'))).toBe('#123abc')
-      expect(colorDirective(colorMd('#def'))).toBe('#def')
-      expect(colorDirective(colorMd('transparent'))).toBe('transparent')
-      expect(colorDirective(colorMd('currentColor'))).toBe('currentColor')
-      expect(colorDirective(colorMd('rgb(255,128,0)'))).toBe('rgb(255,128,0)')
-      expect(colorDirective(colorMd('rgba(16,32,64,0.5)'))).toBe(
-        'rgba(16,32,64,0.5)',
-      )
-    })
-
-    it('does not assign color directive when options have bg keyword', () => {
-      expect(colorDirective(colorMd('#123abc', 'bg'))).toBeUndefined()
-      expect(colorDirective('![bg](red) ![](blue)')).toBe('blue')
-    })
-  })
 })
diff --git a/test/marpit.js b/test/marpit.js
@@ -370,39 +370,6 @@ describe('Marpit', () => {
       })
     })
 
-    describe('[DEPRECATED] Color shorthand', () => {
-      const md = '![](red)![bg](blue)'
-
-      it('applies color to the current slide', () => {
-        const $ = load(new Marpit().render(md).html)
-        expect($('section').html()).toBe('')
-
-        const style = $('section').attr('style')
-        expect(style).toContain('color:red;')
-        expect(style).toContain('background-color:blue;')
-      })
-
-      context('when markdown-it has customized normalization', () => {
-        it('uses original link to detect color', () => {
-          const base = new MarkdownIt()
-          base.normalizeLink = (url) => `test:${url}`
-
-          // Original markdown-it uses customized normalization
-          const baseHTML = base.render(md)
-          expect(baseHTML).toContain('test:red')
-          expect(baseHTML).toContain('test:blue')
-
-          // Wrapped Marp instance uses original link
-          const instance = new Marpit({ markdown: base })
-          const $ = load(instance.render(md).html)
-          const style = $('section').attr('style')
-
-          expect(style).toContain('color:red;')
-          expect(style).toContain('background-color:blue;')
-        })
-      })
-    })
-
     describe('Inline style', () => {
       const instance = () => {
         const marpit = new Marpit()

diff --git a/yarn.lock b/yarn.lock
@@ -2043,19 +2043,11 @@ color-name@1.1.3:
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
   integrity sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==
 
-color-name@^1.0.0, color-name@~1.1.4:
+color-name@~1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
   integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
 
-color-string@^1.9.1:
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/color-string/-/color-string-1.9.1.tgz#4467f9146f036f855b764dfb5bf8582bf342c7a4"
-  integrity sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==
-  dependencies:
-    color-name "^1.0.0"
-    simple-swizzle "^0.2.2"
-
 colord@^2.9.1, colord@^2.9.3:
   version "2.9.3"
   resolved "https://registry.yarnpkg.com/colord/-/colord-2.9.3.tgz#4f8ce919de456f1d5c1c368c307fe20f3e59fb43"
@@ -3201,11 +3193,6 @@ is-arrayish@^0.2.1:
   resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"
   integrity sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==
 
-is-arrayish@^0.3.1:
-  version "0.3.2"
-  resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.3.2.tgz#4574a2ae56f7ab206896fb431eaeed066fdf8f03"
-  integrity sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==
-
 is-bigint@^1.0.1:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/is-bigint/-/is-bigint-1.0.4.tgz#08147a1875bc2b32005d41ccd8291dffc6691df3"
@@ -5200,13 +5187,6 @@ signal-exit@^4.0.1:
   resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-4.1.0.tgz#952188c1cbd546070e2dd20d0f41c0ae0530cb04"
   integrity sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==
 
-simple-swizzle@^0.2.2:
-  version "0.2.2"
-  resolved "https://registry.yarnpkg.com/simple-swizzle/-/simple-swizzle-0.2.2.tgz#a4da6b635ffcccca33f70d17cb92592de95e557a"
-  integrity sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==
-  dependencies:
-    is-arrayish "^0.3.1"
-
 sisteransi@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/sisteransi/-/sisteransi-1.0.5.tgz#134d681297756437cc05ca01370d3a7a571075ed"