Upgrade to Pro — share decks privately, control downloads, hide ads and more …

アクセシビリティチェックを自動化するためのmarkuplintのロードマップ

 アクセシビリティチェックを自動化するためのmarkuplintのロードマップ

Accessibility Step Vol.01

Yusuke Hirao

August 10, 2018
Tweet

More Decks by Yusuke Hirao

Other Decks in Programming

Transcript

  1. ©2018 Yusuke Hirao ࠓޙɺͲ͏͍͏ར༻Λ͍͔ͨ͠ɾͯ͠΄͍͔͠ NBSLVQMJOUͷϩʔυϚοϓ ೥݄WBMQIBΞϧϑΝ൛ύϒϦογϡ ೥݄Wਖ਼ࣜ൛ύϒϦογϡ ⾣೿ੜπʔϧల։ͷͨΊͷ"1*࣮૷ ⾣ϓϥάΠϯɾΧελϜϧʔϧͷ"1*࣮૷ ⾣ΠϯσϯτϑΥʔϚοτɾίʔυελΠϧΛ౷Ұ͢ΔϏϧτΠϯϧʔϧ࣮૷

    ⾣ཁૉɾଐੑνΣοΫ͕࠷௿ݶՄೳͳϏϧτΠϯϧʔϧ࣮૷ ⾣7JTVBM4UVEJP$PEF֦ுWਖ਼ࣜ൛ύϒϦογϡ ೥݄WϚΠφʔόʔδϣϯΞοϓ ⾣)5.--JWJOHTUBOEBSEͷόϦσʔγϣϯ͕Ͱ͖ΔϏϧτΠϯϧʔϧ௥Ճ ⾣8$8"*"3*"ͷόϦσʔγϣϯ͕Ͱ͖ΔϏϧτΠϯϧʔϧ௥Ճ ⾣ϒϥ΢β༻Ϟδϡʔϧ։ൃ ೥݄पลϓϥάΠϯ։ൃ ⾣)5.-JO+4ʢ5FNQMBUFMJUFSBMʣରԠϓϥάΠϯ ⾣QVHରԠϓϥάΠϯ ⾣QIQରԠϓϥάΠϯ
  2. ©2018 Yusuke Hirao ࠓޙɺͲ͏͍͏ར༻Λ͍͔ͨ͠ɾͯ͠΄͍͔͠ NBSLVQMJOUͷϩʔυϚοϓ ೥݄WBMQIBΞϧϑΝ൛ύϒϦογϡ ೥݄Wਖ਼ࣜ൛ύϒϦογϡ ⾣೿ੜπʔϧల։ͷͨΊͷ"1*࣮૷ ⾣ϓϥάΠϯɾΧελϜϧʔϧͷ"1*࣮૷ ⾣ΠϯσϯτϑΥʔϚοτɾίʔυελΠϧΛ౷Ұ͢ΔϏϧτΠϯϧʔϧ࣮૷

    ⾣ཁૉɾଐੑνΣοΫ͕࠷௿ݶՄೳͳϏϧτΠϯϧʔϧ࣮૷ ⾣7JTVBM4UVEJP$PEF֦ுWਖ਼ࣜ൛ύϒϦογϡ ೥݄WϚΠφʔόʔδϣϯΞοϓ ⾣)5.--JWJOHTUBOEBSEͷόϦσʔγϣϯ͕Ͱ͖ΔϏϧτΠϯϧʔϧ௥Ճ ⾣8$8"*"3*"ͷόϦσʔγϣϯ͕Ͱ͖ΔϏϧτΠϯϧʔϧ௥Ճ ⾣ϒϥ΢β༻Ϟδϡʔϧ։ൃ ೥݄पลϓϥάΠϯ։ൃ ⾣)5.-JO+4ʢ5FNQMBUFMJUFSBMʣରԠϓϥάΠϯ ⾣QVHରԠϓϥάΠϯ ⾣QIQରԠϓϥάΠϯ
  3. ©2018 Yusuke Hirao ࠓޙɺͲ͏͍͏ར༻Λ͍͔ͨ͠ɾͯ͠΄͍͔͠ ೿ੜπʔϧల։ͷͨΊͷ"1*࣮૷ ೿ੜπʔϧͷͨΊͷ"1*ఏڙ ࣮૷த  !// ॊೈͰඪ४ͳAPIΛఏڙ͢ΔຊՈ

    import * as markuplint from 'markuplint'; !// ࣮ߦ؀ڥΛ໰Θͳ͍Universal JavaScriptͰར༻Ͱ͖ΔAPI import { MLCore } from '@markuplint/ml-core'; ˞@textlint/kernelʹӨڹΛड͚͍ͯ·͢ɻ
  4. ©2018 Yusuke Hirao ࠓޙɺͲ͏͍͏ར༻Λ͍͔ͨ͠ɾͯ͠΄͍͔͠ NBSLVQMJOUͷϩʔυϚοϓ ೥݄WBMQIBΞϧϑΝ൛ύϒϦογϡ ೥݄Wਖ਼ࣜ൛ύϒϦογϡ ⾣೿ੜπʔϧల։ͷͨΊͷ/PEFKT"1*࣮૷ ⾣ϓϥάΠϯɾΧελϜϧʔϧͷ"1*࣮૷ ⾣ΠϯσϯτϑΥʔϚοτɾίʔυελΠϧΛ౷Ұ͢ΔϏϧτΠϯϧʔϧ࣮૷

    ⾣ཁૉɾଐੑνΣοΫ͕࠷௿ݶՄೳͳϏϧτΠϯϧʔϧ࣮૷ ⾣7JTVBM4UVEJP$PEF֦ுWਖ਼ࣜ൛ύϒϦογϡ ೥݄WϚΠφʔόʔδϣϯΞοϓ ⾣)5.--JWJOHTUBOEBSEͷόϦσʔγϣϯ͕Ͱ͖ΔϏϧτΠϯϧʔϧ௥Ճ ⾣8$8"*"3*"ͷόϦσʔγϣϯ͕Ͱ͖ΔϏϧτΠϯϧʔϧ௥Ճ ⾣ϒϥ΢β༻Ϟδϡʔϧ։ൃ ೥݄पลϓϥάΠϯ։ൃ ⾣)5.-JO+4ʢ5FNQMBUFMJUFSBMʣରԠϓϥάΠϯ ⾣QVHରԠϓϥάΠϯ ⾣QIQରԠϓϥάΠϯ
  5. ©2018 Yusuke Hirao ΞΫηγϏϦςΟνΣοΫͷࣗಈԽ ίϯϙʔωϯτςετ 7VFKTͷྫ import { render }

    from '@vue/server-test-utils'; import Foo from './Foo.vue'; describe('Foo', () !=> { it('renders a div', () !=> { const wrapper = render(Foo); expect(wrapper.text()).toContain('<div>!</div>'); }); }); Ҿ༻IUUQTWVFUFTUVUJMTWVFKTPSHKBBQJSFOEFS
  6. ©2018 Yusuke Hirao ΞΫηγϏϦςΟνΣοΫͷࣗಈԽ ίϯϙʔωϯτςετʹ8"*"3*"νΣοΫΛಋೖ NBSLVQMJOU͸)5.-ͷஅย %PDVNFOU'SBHNFOU Λѻ͑Δ import {

    render } from '@vue/server-test-utils'; import * as markuplint from 'markuplint'; import Foo from './Foo.vue'; describe('Foo', () !=> { it('renders a div', () !=> { const wrapper = render(Foo, { propsData: { pressed: true } }); expect( markuplint.verify({ sourceCodes: wrapper.html(), reportType: 'exception', }), ).toBe(true); }); }); ࢀߟIUUQTWVFUFTUVUJMTWVFKTPSHKBBQJSFOEFS
  7. ©2018 Yusuke Hirao ΞΫηγϏϦςΟνΣοΫͷࣗಈԽ ίϯϙʔωϯτςετʹ8"*"3*"νΣοΫΛಋೖ NBSLVQMJOU͸)5.-ͷஅย %PDVNFOU'SBHNFOU Λѻ͑Δ ࢀߟIUUQTWVFUFTUVUJMTWVFKTPSHKBBQJSFOEFS import

    { render } from '@vue/server-test-utils'; import * as markuplint from 'markuplint'; import Foo from './Foo.vue'; describe('Foo', () !=> { it('renders a div', () !=> { const wrapper = render(Foo, { propsData: { pressed: true } }); expect( markuplint.verify({ sourceCodes: wrapper.html(), reportType: 'exception', }), ).toBe(true); }); }); ීวతͳଐੑ஋ςετ͸·ͱΊͯ୲͏
  8. ©2018 Yusuke Hirao ΞΫηγϏϦςΟνΣοΫͷࣗಈԽ ίʔσΟϯά ίϯϙʔωϯτ ςετ ϦϯτνΣοΫ git push

    ϦϙδτϦ post-receive $*αʔόʔ ϔουϨε ϒϥ΢βʔ test —watch lint —watch ίϯϙʔωϯτ ςετ