fix(icon): render nothing consistently when svg is null

Author: marcosgilf

packages/icon/src/LionIcon.js

@@ -83,7 +83,7 @@ export class LionIcon extends LitElement {
    */
   set svg(svg) {
     this.__svg = svg;
-    if (svg === undefined) {
+    if (svg === undefined || svg === null) {
       this._renderSvg(nothing);
     } else if (isPromise(svg)) {
       this._renderSvg(nothing); // show nothing before resolved

packages/icon/test/lion-icon.test.js

@@ -203,6 +203,18 @@ describe('lion-icon', () => {
     expect(el.innerHTML).to.equal('<!----><!---->'); // don't use lightDom.to.equal(''), it gives false positives
   });
 
+  it('does not render "null" if changed from valid input to null', async () => {
+    const el = await fixture(
+      html`
+        <lion-icon .svg=${heartSvg}></lion-icon>
+      `,
+    );
+    await el.updateComplete;
+    el.svg = null;
+    await el.updateComplete;
+    expect(el.innerHTML).to.equal('<!----><!---->'); // don't use lightDom.to.equal(''), it gives false positives
+  });
+
   describe('race conditions with dynamic promisified icons', () => {
     async function prepareRaceCondition(...svgs) {
       const container = fixtureSync(`<div></div>`);