ben-eb / perfectionist

Beautify CSS files.
MIT License
229 stars 14 forks source link

Reproduce number formatting bug #42

Closed johno closed 7 years ago

johno commented 7 years ago

Firstly, thank you for this project 😸 .

This PR illustrates a small bug when handling fractional numbers. The value 1.05 is being turned into 15. I plan on digging in and proposing a patch when I get some time after work so I will keep you updated.

Input
.foo {
  transform: scale(1.05);
}
Output
.foo {
  transform: scale(15);
}
Test output
❯ npm t

> perfectionist@2.3.0 pretest /Users/johnotander/code/perfectionist
> eslint src

> perfectionist@2.3.0 test /Users/johnotander/code/perfectionist
> ava src/__tests__/

   39 passed
   3 failed

   1. api › can be used as a postcss plugin
   should be consumed   
  t.deepEqual(css, 'h1 {\n    color: #fff;\n}\n.foo {\n    transform: scale(1.05);\n}\n', 'should be consumed')
              |                                                                                                
              "h1 {\n    color: #fff;\n}\n\n.foo {\n    transform: scale(15);\n}\n"                            

      "h1 {/n    color: #fff;/n}/n/n.foo {/n    transform: scale(15);/n}/n"
        api.js:9:11
        process._tickCallback (internal/process/next_tick.js:103:7)

   2. api › can be used as a postcss plugin (2)
   should be consumed   
  t.deepEqual(css, 'h1 {\n    color: #fff;\n}\n.foo {\n    transform: scale(1.05);\n}\n', 'should be consumed')
              |                                                                                                
              "h1 {\n    color: #fff;\n}\n\n.foo {\n    transform: scale(15);\n}\n"                            

      "h1 {/n    color: #fff;/n}/n/n.foo {/n    transform: scale(15);/n}/n"
        api.js:9:11
        process._tickCallback (internal/process/next_tick.js:103:7)

   3. api › can be used as a postcss plugin (3)
   should be consumed   
  t.deepEqual(css, 'h1 {\n    color: #fff;\n}\n.foo {\n    transform: scale(1.05);\n}\n', 'should be consumed')
              |                                                                                                
              "h1 {\n    color: #fff;\n}\n\n.foo {\n    transform: scale(15);\n}\n"                            

      "h1 {/n    color: #fff;/n}/n/n.foo {/n    transform: scale(15);/n}/n"
        api.js:9:11
        process._tickCallback (internal/process/next_tick.js:103:7)
npm ERR! Test failed.  See above for more details.

Related to tachyons-css/tachyons#261

vansosnin commented 7 years ago

You can start digging here ;)

ben-eb commented 7 years ago

Thanks 👍