feat(format-contributor): added alt attributes (#138)

* feat(format-contributor): added `alt` attributes I added `alt` attributes to `img` tags which specifies the name of the contributor in them (for accessibility purposes). * docs: added @Berkmann18 I added myself (I forgot to do that) for code (cf. my previous commit), test and doc.
2025-01-09 13:36:29 +00:00 · 2019-01-14 16:23:02 +00:00 · 2019-01-14 16:23:02 +00:00 · 87ce8bb8a7
commit 87ce8bb8a7
parent 8aa15c9ed8
4 changed files with 27 additions and 10 deletions
--- a/.all-contributorsrc
+++ b/.all-contributorsrc
@ -255,6 +255,17 @@
        "doc",
        "test"
      ]
+    },
+    {
+      "login": "Berkmann18",
+      "name": "Maximilian Berkmann",
+      "avatar_url": "https://avatars0.githubusercontent.com/u/8260834?v=4",
+      "profile": "http://maxcubing.wordpress.com",
+      "contributions": [
+        "code",
+        "test",
+        "doc"
+      ]
    }
  ]
 }
--- a/README.md
+++ b/README.md
@ -11,7 +11,7 @@
 [![MIT License][license-badge]][license]
 [![Chat on Slack][chat-badge]][chat]

-[![All Contributors](https://img.shields.io/badge/all_contributors-26-orange.svg?style=flat-square)](#contributors)
+[![All Contributors](https://img.shields.io/badge/all_contributors-27-orange.svg?style=flat-square)](#contributors)
 [![PRs Welcome][prs-badge]][prs] [![Code of Conduct][coc-badge]][coc]
 [![Watch on GitHub][github-watch-badge]][github-watch]
 [![Star on GitHub][github-star-badge]][github-star]
@ -229,7 +229,8 @@ Thanks goes to these wonderful people
 | [<img src="https://avatars3.githubusercontent.com/u/8212?v=3" width="100px;"/><br /><sub><b>Jerod Santo</b></sub>](https://jerodsanto.net)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=jerodsanto "Code") | [<img src="https://avatars1.githubusercontent.com/u/574871?v=3" width="100px;"/><br /><sub><b>Kevin Jalbert</b></sub>](https://github.com/kevinjalbert)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=kevinjalbert "Code") | [<img src="https://avatars3.githubusercontent.com/u/5038030?v=4" width="100px;"/><br /><sub><b>tunnckoCore</b></sub>](https://i.am.charlike.online)<br />[🔧](#tool-charlike "Tools") | [<img src="https://avatars2.githubusercontent.com/u/304450?v=4" width="100px;"/><br /><sub><b>Mehdi Achour</b></sub>](https://machour.idk.tn/)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=machour "Code") | [<img src="https://avatars1.githubusercontent.com/u/8344688?v=4" width="100px;"/><br /><sub><b>Roy Revelt</b></sub>](https://codsen.com)<br />[🐛](https://github.com/all-contributors/all-contributors-cli/issues?q=author%3Arevelt "Bug reports") | [<img src="https://avatars1.githubusercontent.com/u/422331?v=4" width="100px;"/><br /><sub><b>Chris Vickery</b></sub>](https://github.com/chrisinajar)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=chrisinajar "Code") |
 | [<img src="https://avatars2.githubusercontent.com/u/1026002?v=4" width="100px;"/><br /><sub><b>Bryce Reynolds</b></sub>](https://github.com/brycereynolds)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=brycereynolds "Code") | [<img src="https://avatars3.githubusercontent.com/u/2322305?v=4" width="100px;"/><br /><sub><b>James, please</b></sub>](http://www.jmeas.com)<br />[🤔](#ideas-jmeas "Ideas, Planning, & Feedback") [💻](https://github.com/all-contributors/all-contributors-cli/commits?author=jmeas "Code") | [<img src="https://avatars3.githubusercontent.com/u/1057324?v=4" width="100px;"/><br /><sub><b>Spyros Ioakeimidis</b></sub>](http://www.spyros.io)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=spirosikmd "Code") | [<img src="https://avatars3.githubusercontent.com/u/12335761?v=4" width="100px;"/><br /><sub><b>Fernando Costa</b></sub>](https://github.com/fadc80)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=fadc80 "Code") | [<img src="https://avatars0.githubusercontent.com/u/197404?v=4" width="100px;"/><br /><sub><b>snipe</b></sub>](https://snipe.net)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=snipe "Documentation") | [<img src="https://avatars0.githubusercontent.com/u/997157?v=4" width="100px;"/><br /><sub><b>Gant Laborde</b></sub>](http://gantlaborde.com/)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=GantMan "Code") |
 | [<img src="https://avatars2.githubusercontent.com/u/17708702?v=4" width="100px;"/><br /><sub><b>Md Zubair Ahmed</b></sub>](https://in.linkedin.com/in/mzubairahmed)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=M-ZubairAhmed "Documentation") [🐛](https://github.com/all-contributors/all-contributors-cli/issues?q=author%3AM-ZubairAhmed "Bug reports") [💻](https://github.com/all-contributors/all-contributors-cli/commits?author=M-ZubairAhmed "Code") [⚠️](https://github.com/all-contributors/all-contributors-cli/commits?author=M-ZubairAhmed "Tests") | [<img src="https://avatars3.githubusercontent.com/u/6177621?v=4" width="100px;"/><br /><sub><b>Divjot Singh</b></sub>](http://bogas04.github.io)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=bogas04 "Documentation") | [<img src="https://avatars0.githubusercontent.com/u/15315098?v=4" width="100px;"/><br /><sub><b>João Marques</b></sub>](https://github.com/tigermarques)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=tigermarques "Code") [📖](https://github.com/all-contributors/all-contributors-cli/commits?author=tigermarques "Documentation") [🤔](#ideas-tigermarques "Ideas, Planning, & Feedback") | [<img src="https://avatars3.githubusercontent.com/u/1192452?v=4" width="100px;"/><br /><sub><b>Andrew Lisowski</b></sub>](http://hipstersmoothie.com)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=hipstersmoothie "Code") [📖](https://github.com/all-contributors/all-contributors-cli/commits?author=hipstersmoothie "Documentation") [⚠️](https://github.com/all-contributors/all-contributors-cli/commits?author=hipstersmoothie "Tests") | [<img src="https://avatars3.githubusercontent.com/u/1736154?v=4" width="100px;"/><br /><sub><b>Xianming Zhong</b></sub>](https://github.com/chinesedfan)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=chinesedfan "Documentation") | [<img src="https://avatars2.githubusercontent.com/u/8073251?v=4" width="100px;"/><br /><sub><b>C.Y.Xu</b></sub>](https://github.com/xuchaoying)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=xuchaoying "Code") |
-| [<img src="https://avatars3.githubusercontent.com/u/3680914?v=4" width="100px;"/><br /><sub><b>Dura</b></sub>](https://github.com/chris-dura)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=chris-dura "Documentation") | [<img src="https://avatars2.githubusercontent.com/u/3534236?v=4" width="100px;"/><br /><sub><b>Jake Bolam</b></sub>](https://jakebolam.com)<br />[🚇](#infra-jakebolam "Infrastructure (Hosting, Build-Tools, etc)") [💻](https://github.com/all-contributors/all-contributors-cli/commits?author=jakebolam "Code") [📖](https://github.com/all-contributors/all-contributors-cli/commits?author=jakebolam "Documentation") [⚠️](https://github.com/all-contributors/all-contributors-cli/commits?author=jakebolam "Tests") |
+| [<img src="https://avatars3.githubusercontent.com/u/3680914?v=4" width="100px;"/><br /><sub><b>Dura</b></sub>](https://github.com/chris-dura)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=chris-dura "Documentation") | [<img src="https://avatars2.githubusercontent.com/u/3534236?v=4" width="100px;"/><br /><sub><b>Jake Bolam</b></sub>](https://jakebolam.com)<br />[🚇](#infra-jakebolam "Infrastructure (Hosting, Build-Tools, etc)") [💻](https://github.com/all-contributors/all-contributors-cli/commits?author=jakebolam "Code") [📖](https://github.com/all-contributors/all-contributors-cli/commits?author=jakebolam "Documentation") [⚠️](https://github.com/all-contributors/all-contributors-cli/commits?author=jakebolam "Tests") | [<img src="https://avatars0.githubusercontent.com/u/8260834?v=4" width="100px;"/><br /><sub><b>Maximilian Berkmann</b></sub>](http://maxcubing.wordpress.com)<br />[💻](https://github.com/all-contributors/all-contributors-cli/commits?author=Berkmann18 "Code") [⚠️](https://github.com/all-contributors/all-contributors-cli/commits?author=Berkmann18 "Tests") [📖](https://github.com/all-contributors/all-contributors-cli/commits?author=Berkmann18 "Documentation") |
+
 <!-- ALL-CONTRIBUTORS-LIST:END -->

 This project follows the
--- a/src/generate/tests/format-contributor.js
+++ b/src/generate/tests/format-contributor.js
@ -20,7 +20,7 @@ test('format a simple contributor', () => {
  const {options} = fixtures()

  const expected =
-    '[<img src="https://avatars1.githubusercontent.com/u/1500684" width="150px;"/><br /><sub><b>Kent C. Dodds</b></sub>](http://kentcdodds.com)<br />[👀](#review-kentcdodds "Reviewed Pull Requests")'
+    '[<img src="https://avatars1.githubusercontent.com/u/1500684" width="150px;" alt="Kent C. Dodds"/><br /><sub><b>Kent C. Dodds</b></sub>](http://kentcdodds.com)<br />[👀](#review-kentcdodds "Reviewed Pull Requests")'

  expect(formatContributor(options, contributor)).toBe(expected)
 })
@ -30,7 +30,7 @@ test('format contributor with complex contribution types', () => {
  const {options} = fixtures()

  const expected =
-    '[<img src="https://avatars1.githubusercontent.com/u/1500684" width="150px;"/><br /><sub><b>Kent C. Dodds</b></sub>](http://kentcdodds.com)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=kentcdodds "Documentation") [👀](#review-kentcdodds "Reviewed Pull Requests") [💬](#question-kentcdodds "Answering Questions")'
+    '[<img src="https://avatars1.githubusercontent.com/u/1500684" width="150px;" alt="Kent C. Dodds"/><br /><sub><b>Kent C. Dodds</b></sub>](http://kentcdodds.com)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=kentcdodds "Documentation") [👀](#review-kentcdodds "Reviewed Pull Requests") [💬](#question-kentcdodds "Answering Questions")'

  expect(formatContributor(options, contributor)).toBe(expected)
 })
@ -53,7 +53,7 @@ test('default image size to 100', () => {
  delete options.imageSize

  const expected =
-    '[<img src="https://avatars1.githubusercontent.com/u/1500684" width="100px;"/><br /><sub><b>Kent C. Dodds</b></sub>](http://kentcdodds.com)<br />[👀](#review-kentcdodds "Reviewed Pull Requests")'
+    '[<img src="https://avatars1.githubusercontent.com/u/1500684" width="100px;" alt="Kent C. Dodds"/><br /><sub><b>Kent C. Dodds</b></sub>](http://kentcdodds.com)<br />[👀](#review-kentcdodds "Reviewed Pull Requests")'

  expect(formatContributor(options, contributor)).toBe(expected)
 })
@ -63,7 +63,7 @@ test('format contributor with pipes in their name', () => {
  const {options} = fixtures()

  const expected =
-    '[<img src="https://avatars1.githubusercontent.com/u/1500684" width="150px;"/><br /><sub><b>Who &#124; Needs &#124; Pipes?</b></sub>](http://github.com/chrisinajar)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=pipey "Documentation")'
+    '[<img src="https://avatars1.githubusercontent.com/u/1500684" width="150px;" alt="Who &#124; Needs &#124; Pipes?"/><br /><sub><b>Who &#124; Needs &#124; Pipes?</b></sub>](http://github.com/chrisinajar)<br />[📖](https://github.com/all-contributors/all-contributors-cli/commits?author=pipey "Documentation")'

  expect(formatContributor(options, contributor)).toBe(expected)
 })
@ -73,7 +73,7 @@ test('format contributor with no github account', () => {
  const {options} = fixtures()

  const expected =
-    '<img src="https://avatars1.githubusercontent.com/u/1500684" width="150px;"/><br /><sub><b>No Github Account</b></sub><br />[🌍](#translation "Translation")'
+    '<img src="https://avatars1.githubusercontent.com/u/1500684" width="150px;" alt="No Github Account"/><br /><sub><b>No Github Account</b></sub><br />[🌍](#translation "Translation")'

  expect(formatContributor(options, contributor)).toBe(expected)
 })
--- a/src/generate/format-contributor.js
+++ b/src/generate/format-contributor.js
@ -2,7 +2,7 @@ const _ = require('lodash/fp')
 const formatContributionType = require('./format-contribution-type')

 const avatarTemplate = _.template(
-  '<img src="<%= contributor.avatar_url %>" width="<%= options.imageSize %>px;"/>',
+  '<img src="<%= contributor.avatar_url %>" width="<%= options.imageSize %>px;" alt="<%= name %>"/>',
 )
 const avatarBlockTemplate = _.template(
  '[<%= avatar %><br /><sub><b><%= name %></b></sub>](<%= contributor.profile %>)',
@ -17,10 +17,15 @@ const contributorTemplate = _.template(
 const defaultImageSize = 100

 function defaultTemplate(templateData) {
-  const avatar = avatarTemplate(templateData)
+  const name = escapeName(templateData.contributor.name)
+  const avatar = avatarTemplate(
+    _.assign(templateData, {
+      name,
+    }),
+  )
  const avatarBlockTemplateData = _.assign(
    {
-      name: escapeName(templateData.contributor.name),
+      name,
      avatar,
    },
    templateData,