Web UI shows blank for details tab when server address is blank (#4248)

* updated changelog

* Web UI appears blank fix

* Updated DetailsSpec snapshot
This commit is contained in:
Samhita-sopho 2020-12-06 06:56:53 -06:00 committed by GitHub
parent 1ed3f95067
commit 6846c8db33
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 148 additions and 7 deletions

View File

@ -10,7 +10,7 @@ Unreleased: mitmproxy next
* Addon to suppress unwanted error messages sent by mitmproxy. (@anneborcherding)
* Updated imports and styles for web scanner helper addons. (@anneborcherding)
* Inform when underscore-formatted options are used in client arg. (@jrblixt)
* Fixed the web UI showing blank page on clicking details tab when server address is missing (@samhita-sopho)
* --- TODO: add new PRs above this line ---
* ... and various other fixes, documentation improvements, dependency version bumps, etc.

View File

@ -47,4 +47,24 @@ describe('Details Component', () => {
tree = details.toJSON()
expect(tree).toMatchSnapshot()
})
it('should render correctly when server address is missing', () => {
let tflowServerAddressNull = tflow
tflowServerAddressNull.server_conn.address = null
tflowServerAddressNull.server_conn.ip_address = null
tflowServerAddressNull.server_conn.alpn_proto_negotiated = null
tflowServerAddressNull.server_conn.sni = null
tflowServerAddressNull.server_conn.ssl_established = false
tflowServerAddressNull.server_conn.tls_version = null
tflowServerAddressNull.server_conn.timestamp_tcp_setup = null
tflowServerAddressNull.server_conn.timestamp_ssl_setup = null
tflowServerAddressNull.server_conn.timestamp_start = null
tflowServerAddressNull.server_conn.timestamp_end = null
let details = renderer.create(<Details flow={tflowServerAddressNull}/>),
tree = details.toJSON()
expect(tree).toMatchSnapshot()
})
})

View File

@ -237,6 +237,123 @@ exports[`Details Component should render correctly 1`] = `
</section>
`;
exports[`Details Component should render correctly when server address is missing 1`] = `
<section
className="detail"
>
<h4>
Client Connection
</h4>
<table
className="connection-table"
>
<tbody>
<tr>
<td>
Address:
</td>
<td>
127.0.0.1:22
</td>
</tr>
<tr>
<td>
<abbr
title="TLS Server Name Indication"
>
TLS SNI:
</abbr>
</td>
<td>
address
</td>
</tr>
<tr>
<td>
TLS version:
</td>
<td>
TLSv1.2
</td>
</tr>
<tr>
<td>
cipher name:
</td>
<td>
cipher
</td>
</tr>
<tr>
<td>
<abbr
title="ALPN protocol negotiated"
>
ALPN:
</abbr>
</td>
<td>
http/1.1
</td>
</tr>
</tbody>
</table>
<div />
<div>
<h4>
Timing
</h4>
<table
className="timing-table"
>
<tbody>
<tr />
<tr />
<tr />
<tr />
<tr />
<tr>
<td>
Client conn. established
:
</td>
<td>
1970-01-01 00:00:01.000
</td>
</tr>
<tr>
<td>
Client conn. SSL handshake
:
</td>
<td>
1970-01-01 00:00:02.000
</td>
</tr>
<tr>
<td>
First response byte
:
</td>
<td>
2017-05-21 12:38:32.481
</td>
</tr>
<tr>
<td>
Response complete
:
</td>
<td>
2017-05-21 12:38:32.481
</td>
</tr>
</tbody>
</table>
</div>
</section>
`;
exports[`TimeStamp Component should render correctly 1`] = `
<tr>
<td>

View File

@ -136,8 +136,12 @@ export default function Details({ flow }) {
<h4>Client Connection</h4>
<ConnectionInfo conn={flow.client_conn}/>
<h4>Server Connection</h4>
{flow.server_conn.address &&
[
<h4>Server Connection</h4>,
<ConnectionInfo conn={flow.server_conn}/>
]
}
<CertificateInfo flow={flow}/>