title: Typescript guard fails on union types
body: <p>I don't understand why TypeScript complains about a possible undefined object (<code>customer.id</code>) in this example:</p>
  
  <pre class="lang-js prettyprint-override"><code>type Customer = {
    id: string
    company: string
  }
  
  type Props =
    | {
        mode: 'new'
        customer: undefined
      }
    | {
        mode: 'edit'
        customer: Customer
    }
  
  function form({ mode, customer }: Props) {
    const formId = mode === 'edit' ? customer.id : 'foo'
  }
  </code></pre>
  
  <p>From my understand, customer can never be <code>undefined</code> as lang as <code>mode</code> is <code>edit</code>. I thought that this one is some sort of TypeScript Guard?</p>
  
  <p><a href="http://www.typescriptlang.org/play/?ssl=1&amp;ssc=1&amp;pln=18&amp;pc=2#code/C4TwDgpgBAwgrgZ2AewLYQE5QLxQN4BQUUAlgCYBcUSGJAdgOZFQDGaYAhnSFTfUwF8CBUJCgAFDMjAIczAD75mxYqmRkIVAOR0IAdy3KVLRCnQYqcOhoBm9CGSNDiiwipVqN2hyWCH3xCZIaJhU8MHmzEIENlYswCTIdFA2yBioABR4UJ4QADSspiFYAlSS0ggAlEqBSUgpaagAkmQ4OerQ2F1QWj5+UAD8hRGYAHTkUNqpyIYCQA" rel="nofollow noreferrer">Playground</a></p>