title: TS2339: Property does not exist on union type - property string | undefined
body: <p>I have problem with my union type, which looks like this:</p>
  
  <pre><code>type RepeatForm = {
      step:
          | {
                repeat: false;
            }
          | {
                repeat: true;
                from: undefined;
            }
          | {
                repeat: true;
                from: string;
                by?: string;
            };
  };
  </code></pre>
  
  <p>And I have following function where I want to get value of <code>by</code> if it's there:</p>
  
  <pre><code>export const getByField = (form: RepeatForm) =&gt; {
      if (form.step.repeat === false || form.step.from === undefined) {
          return null;
      }
      const x = form.step.from;
      return form.step.by;
  };
  </code></pre>
  
  <p>I get this error: <code>Property 'by' does not exist on type '{ repeat: true; from: undefined; } | { repeat: true; from: string; by?: string | undefined; }'.
    Property 'by' does not exist on type '{ repeat: true; from: undefined; }'.</code></p>
  
  <p>Which is super confusing for me, because TypeScript know that <code>form.step.from</code> is different from <code>undefined</code> and he even interpolates type of variable <code>x</code> to <code>string</code>.</p>
  
  <p>What's the reason of this issue? How can I access <code>by</code> property then?</p>