Styles are not applied to the LitElement in Safari/Firefox when undefined/null/'' returned from render first and then TemplateResult during next render

[pavloKozlov]

Description

If undefined/null/'' (empty string) returned from render method of LitElement during the first render of the component and then lit-html TemplateResult (result of html`` call) is returned with some css classes (styles are defined in styles static getter method), these styles are not applied.

If render method returns lit-html TemplateResult after first render of component, then <style> tag exists in shadow DOM.

I also created a question on StackOverflow.

Steps to Reproduce

1. Write this code

<script src="https://unpkg.com/@webcomponents/webcomponentsjs@next/webcomponents-loader.js"></script>
<script type="module">
  import {LitElement, html, css} from 'https://unpkg.com/@polymer/lit-element@latest/lit-element.js?module';

  class MyElement extends LitElement {
  
	  static get properties() {
    	return {
      	shown: Boolean,
      }
    }

		static get styles() {
    	return [css`
      	.colored {
        	color: green;
        }
      `];
    }
    
		connectedCallback() {
    	super.connectedCallback && super.connectedCallback();
      
      if (!this.shown) {
        setTimeout(() => {
          this.shown = true;
          this.requestUpdate();
        }, 1000);
      }
    }

    render() {
      return this.shown ? 
      	html`<span class="colored">Green</span>` :
        undefined
    }  
  }
	
  customElements.define('my-element', MyElement);
</script>

<my-element shown="true"></my-element>
<my-element></my-element>

2. See this output...
   https://i.stack.imgur.com/b7MzD.png

Live Reproduction Link

https://jsfiddle.net/PavelKozlov/u2dmy4s1/6/

Expected Results

Both elements in an example are displayed with a green color.

Actual Results

The first element is green and the second element is displayed with default color.

Browsers Affected

• Chrome
• Firefox
• Edge
• Safari 11
• Safari 10
• IE 11

[justinfagnani]

This was fixed by lit/lit-element#712