Does not work with img tag?

#12 · closed · 3 comments

View on GitHub ↗

andrey-hohlov

Hello! Simple example: ```javascript const gulp = require('gulp'); const posthtml = require('gulp-posthtml'); gulp.task('test', function () { const plugins = [ require('posthtml-attrs-sorter')({ order: [ 'id', 'class', 'src', 'width', 'height', 'for', 'type', 'href', 'title', 'alt', 'value' ] }) ]; const options = {}; gulp.src('./_v/test.html') .pipe(posthtml(plugins, options)) .pipe(gulp.dest('./_v')) }); ``` #### Before: ```html <div class="class" id="id1"></div> <img width="20" src="../images/image.png" height="40" alt="image" class="cls" id="id2"> <input type="text" id="id3" class="cls" value="22"> ``` #### After: ```html <div id="id1" class="class"></div> <img width="20" id="id2" class="cls" src="../images/image.png" height="40" alt="image"> <input id="id3" class="cls" type="text" value="22"> ``` Attributes in `img` tag aren't formatted.

Comments

andrey-hohlov

Problem with 'width' attribute and RegExp: ![index js - golenkova - work repositories golenkova 2016-12-06 17-49-04](https://cloud.githubusercontent.com/assets/7358151/20922781/f2febf88-bbdb-11e6-9d0b-dd66cd8813f7.png)

andrey-hohlov

Works with this fixes: ```javascript orderList.forEach(function(item) { if (new RegExp('^' + item + '([A-Za-z0-9-]*)').test(a)) { a = item; } if (new RegExp('^' + item + '([A-Za-z0-9-]*)').test(b)) { b = item; } }); ``` #### Before: ```html <img alt="image" src="../images/image.png" width="20" class="cls" height="40" id="id2" data-foo="bar" ng-click="something()"> ``` #### After: ```html <img id="id2" class="cls" src="../images/image.png" width="20" height="40" data-foo="bar" ng-click="something()" alt="image"> ``` I can create pull request if you do not mind.

mrmlnc

Thanks for reporting and great analyse 🌮 Should be fixed in `1.0.0` 🎉