[SIEM] Fix: Empty Source / Destination shown when only ports are …

…populated (#50843) (#50971)

Fixes an issue where an empty `Source` or `Destination` container is rendered by
the Timeline row renderer when events have `source.port` or `destination.port` populated,
but the corresponding `source.ip` or `destination.ip` is not.

![chrome-before](https://user-images.githubusercontent.com/4459398/68985053-fd26ec80-07d0-11ea-99e3-1180a3e9d7fb.png)

![chrome-after](https://user-images.githubusercontent.com/4459398/68985058-0912ae80-07d1-11ea-990a-1a66802cad0e.png)

The following JSON is from the event shown in the screenshots above:

```
  "destination": {
    "port": 53
  },
```

In the JSON above, the `destination.port` field is populated, but the
`destination.ip` field is **not** populated.

The `destination.port` in the event is expected to be rendered in the
"before" screenshot above, but an empty `Destination` label is rendered
instead.

1. Create a new timeline with the following KQL:

```
destination.port: * and NOT destination.ip: *
```

**Expected Result**

- The `destination.port` contained in the event is rendered in the `Destination` container

**Actual result**

- An empty `Destination` is rendered, per the "before" screenshot above

An analysis of real data performed while desk testing this PR revealed other
corner cases in real-world data, including port arrays with `null` values.

The types and implementaion were updated to reflect the reality of the data
found during desk testing. Unit tests were added to cover these cases.

![firefox-after](https://user-images.githubusercontent.com/4459398/68985063-10d25300-07d1-11ea-9c17-d962c0f1015e.png)

![safari-after](https://user-images.githubusercontent.com/4459398/68985067-162f9d80-07d1-11ea-8773-d3e71a84a440.png)

Note: This PR was NOT tested in IE 11, due to unrelated IE 11 issues with dependencies in `master`

* elastic/siem-team#476