some icons broken after composer update

coriolanweihrauch commented 5 years ago

Prerequisites

[ x ] I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
[ x ] The issue still exists against the latest master branch of yii2-icons.
[ x ] This is not an usage question. I confirm having gone through and read the documentation and demos.
[ x ] This is not a general programming / coding question. (Those should be directed to the webtips Q & A forum).
[ x ] I have attempted to find the simplest possible steps to reproduce the issue.
[ x ] I have included a failing test as a pull request (Optional).

Steps to reproduce the issue

ran composer update on my yii2 project
multiple FontAwesome icons which were previously working now display as circles with blinking/alternating question mark / exclamation mark
some affected icons are
- Icon::show('inr', ['class'=>'fa-fw'])
- Icon::show('map-o', ['class'=>'fa-fw'])
- Icon::show('gear', ['class'=>'fa-fw'])
icons which still work include
- Icon::show('home', ['class'=>'fa-fw'])
- Icon::show('list', ['class'=>'fa-fw'])

Expected behavior and actual behavior

When I follow those steps, I see this svg code:

<svg class="svg-inline--fa fa-rupee fa-w-16" aria-hidden="true" data-prefix="fa" data-icon="rupee" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><g><path fill="currentColor" d="M156.5,447.7l-12.6,29.5c-18.7-9.5-35.9-21.2-51.5-34.9l22.7-22.7C127.6,430.5,141.5,440,156.5,447.7z M40.6,272H8.5 c1.4,21.2,5.4,41.7,11.7,61.1L50,321.2C45.1,305.5,41.8,289,40.6,272z M40.6,240c1.4-18.8,5.2-37,11.1-54.1l-29.5-12.6 C14.7,194.3,10,216.7,8.5,240H40.6z M64.3,156.5c7.8-14.9,17.2-28.8,28.1-41.5L69.7,92.3c-13.7,15.6-25.5,32.8-34.9,51.5 L64.3,156.5z M397,419.6c-13.9,12-29.4,22.3-46.1,30.4l11.9,29.8c20.7-9.9,39.8-22.6,56.9-37.6L397,419.6z M115,92.4 c13.9-12,29.4-22.3,46.1-30.4l-11.9-29.8c-20.7,9.9-39.8,22.6-56.8,37.6L115,92.4z M447.7,355.5c-7.8,14.9-17.2,28.8-28.1,41.5 l22.7,22.7c13.7-15.6,25.5-32.9,34.9-51.5L447.7,355.5z M471.4,272c-1.4,18.8-5.2,37-11.1,54.1l29.5,12.6 c7.5-21.1,12.2-43.5,13.6-66.8H471.4z M321.2,462c-15.7,5-32.2,8.2-49.2,9.4v32.1c21.2-1.4,41.7-5.4,61.1-11.7L321.2,462z M240,471.4c-18.8-1.4-37-5.2-54.1-11.1l-12.6,29.5c21.1,7.5,43.5,12.2,66.8,13.6V471.4z M462,190.8c5,15.7,8.2,32.2,9.4,49.2h32.1 c-1.4-21.2-5.4-41.7-11.7-61.1L462,190.8z M92.4,397c-12-13.9-22.3-29.4-30.4-46.1l-29.8,11.9c9.9,20.7,22.6,39.8,37.6,56.9 L92.4,397z M272,40.6c18.8,1.4,36.9,5.2,54.1,11.1l12.6-29.5C317.7,14.7,295.3,10,272,8.5V40.6z M190.8,50 c15.7-5,32.2-8.2,49.2-9.4V8.5c-21.2,1.4-41.7,5.4-61.1,11.7L190.8,50z M442.3,92.3L419.6,115c12,13.9,22.3,29.4,30.5,46.1 l29.8-11.9C470,128.5,457.3,109.4,442.3,92.3z M397,92.4l22.7-22.7c-15.6-13.7-32.8-25.5-51.5-34.9l-12.6,29.5 C370.4,72.1,384.4,81.5,397,92.4z"></path><circle fill="currentColor" cx="256" cy="364" r="21.7059"><animate attributeType="XML" repeatCount="indefinite" dur="2s" attributeName="r" values="28;14;28;28;14;28;"></animate><animate attributeType="XML" repeatCount="indefinite" dur="2s" attributeName="opacity" values="1;0;1;1;0;1;"></animate></circle><path fill="currentColor" opacity="1" d="M263.7,312h-16c-6.6,0-12-5.4-12-12c0-71,77.4-63.9,77.4-107.8c0-20-17.8-40.2-57.4-40.2c-29.1,0-44.3,9.6-59.2,28.7 c-3.9,5-11.1,6-16.2,2.4l-13.1-9.2c-5.6-3.9-6.9-11.8-2.6-17.2c21.2-27.2,46.4-44.7,91.2-44.7c52.3,0,97.4,29.8,97.4,80.2 c0,67.6-77.4,63.5-77.4,107.8C275.7,306.6,270.3,312,263.7,312z"><animate attributeType="XML" repeatCount="indefinite" dur="2s" attributeName="opacity" values="1;0;0;0;0;1;"></animate></path><path fill="currentColor" opacity="0" d="M232.5,134.5l7,168c0.3,6.4,5.6,11.5,12,11.5h9c6.4,0,11.7-5.1,12-11.5l7-168c0.3-6.8-5.2-12.5-12-12.5h-23 C237.7,122,232.2,127.7,232.5,134.5z"><animate attributeType="XML" repeatCount="indefinite" dur="2s" attributeName="opacity" values="0;0;1;1;0;0;"></animate></path></g></svg>

<!-- <i class="fa fa-rupee"></i> -->

and the circle with blinking/alternating ? and !

I was expecting the rupee symbol

This may be related to what is described here: https://volaresystems.com/blog/post/2018/01/22/Upgrading-FontAwesome-from-4-to-5 though changing from fa to far didn't make any difference for me

Environment

php7, apache, debian 9

phpinfo attached phpinfo.htm.zip

My composer.json and composer.lock file attached composer.zip

Browsers

[ x ] Google Chrome
[ x ] Mozilla Firefox
[ untested ] Internet Explorer
[ x ] Safari

Operating System

[ x ] Windows
[ x ] Mac OS X
[ untested ] Linux
[ untested ] Mobile

Libraries

jQuery version: 3.3.1 (bower-asset)
yii2-icons version: v1.4.5

Isolating the problem

[ n/a ] This bug happens on the demos page
[ x ] The bug happens consistently across all tested browsers
[ untested ] This bug happens when using yii2-icons without other plugins.

kartik-v commented 5 years ago

Font awesome is updated to release v5.0.0 - the icons have changed there... cross check.

coriolanweihrauch commented 5 years ago

Confirmed, font awesome changed the names / made some icons pro (and introduced some free alternatives)

Icon::show('inr', ['class'=>'fa-fw']) change to Icon::show('rupee-sign', ['class'=>'fa-fw']) https://fontawesome.com/icons/rupee-sign?style=solid
Icon::show('map-o', ['class'=>'fa-fw']) change to Icon::show('map', ['class'=>'fa-fw']) https://fontawesome.com/icons/map?style=regular
Icon::show('gear', ['class'=>'fa-fw']) change to Icon::show('cog', ['class'=>'fa-fw']) https://fontawesome.com/icons/cog?style=solid

kartik-v / yii2-icons