From 98b827b9f3e783a36a4dee253d0cc9a3ce91f769 Mon Sep 17 00:00:00 2001
From: Ingo Oppermann <ingo@datarhei.com>
Date: Fri, 18 Nov 2022 10:35:06 +0100
Subject: [PATCH] Refine network source test

---
 src/views/Edit/Sources/Network.js      | 288 +++++++++++++------------
 src/views/Edit/Sources/Network.test.js |   6 +-
 2 files changed, 155 insertions(+), 139 deletions(-)

diff --git a/src/views/Edit/Sources/Network.js b/src/views/Edit/Sources/Network.js
index 993fbd9..b11ef06 100644
--- a/src/views/Edit/Sources/Network.js
+++ b/src/views/Edit/Sources/Network.js
@@ -152,7 +152,9 @@ const initSkills = (initialSkills) => {
 	};
 
 	if (skills.formats.demuxers.includes('rtsp')) {
-		skills.protocols.input.push('rtsp');
+		if (!skills.protocols.input.includes('rtsp')) {
+			skills.protocols.input.push('rtsp');
+		}
 	}
 
 	return skills;
@@ -408,6 +410,7 @@ function Pull(props) {
 	const settings = props.settings;
 	const protocolClass = getProtocolClass(settings.address);
 	const authProtocol = isAuthProtocol(settings.address);
+	const validURL = isValidURL(settings.address);
 	const supportedProtocol = isSupportedProtocol(settings.address, props.skills.protocols.input);
 
 	return (
@@ -430,68 +433,133 @@ function Pull(props) {
 					<Trans>Supports HTTP (HLS, DASH), RTP, RTSP, RTMP, SRT and more.</Trans>
 				</Typography>
 			</Grid>
-			{!supportedProtocol ? (
-				<Grid item xs={12} align="center">
-					<BoxText color="dark">
-						<WarningIcon fontSize="large" color="error" />
-						<Typography>
-							<Trans>This protocol is unknown or not supported by the available FFmpeg binary.</Trans>
-						</Typography>
-					</BoxText>
-				</Grid>
-			) : (
+			{validURL === true && (
 				<React.Fragment>
-					{authProtocol && (
-						<React.Fragment>
-							<Grid item md={6} xs={12}>
-								<TextField
-									variant="outlined"
-									fullWidth
-									label={<Trans>Username</Trans>}
-									value={settings.username}
-									onChange={props.onChange('', 'username')}
-								/>
-								<Typography variant="caption">
-									<Trans>Username for the device.</Trans>
-								</Typography>
-							</Grid>
-							<Grid item md={6} xs={12}>
-								<Password
-									variant="outlined"
-									fullWidth
-									label={<Trans>Password</Trans>}
-									value={settings.password}
-									onChange={props.onChange('', 'password')}
-								/>
-								<Typography variant="caption">
-									<Trans>Password for the device.</Trans>
-								</Typography>
-							</Grid>
-						</React.Fragment>
-					)}
-					<Grid item xs={12}>
-						<Accordion className="accordion">
-							<AccordionSummary elevation={0} expandIcon={<ArrowDropDownIcon />}>
+					{!supportedProtocol ? (
+						<Grid item xs={12} align="center">
+							<BoxText color="dark">
+								<WarningIcon fontSize="large" color="error" />
 								<Typography>
-									<Trans>Advanced settings</Trans>
+									<Trans>This protocol is unknown or not supported by the available FFmpeg binary.</Trans>
 								</Typography>
-							</AccordionSummary>
-							<AccordionDetails>
-								<Grid container spacing={2}>
-									{protocolClass === 'rtsp' && (
-										<React.Fragment>
+							</BoxText>
+						</Grid>
+					) : (
+						<React.Fragment>
+							{authProtocol && (
+								<React.Fragment>
+									<Grid item md={6} xs={12}>
+										<TextField
+											variant="outlined"
+											fullWidth
+											label={<Trans>Username</Trans>}
+											value={settings.username}
+											onChange={props.onChange('', 'username')}
+										/>
+										<Typography variant="caption">
+											<Trans>Username for the device.</Trans>
+										</Typography>
+									</Grid>
+									<Grid item md={6} xs={12}>
+										<Password
+											variant="outlined"
+											fullWidth
+											label={<Trans>Password</Trans>}
+											value={settings.password}
+											onChange={props.onChange('', 'password')}
+										/>
+										<Typography variant="caption">
+											<Trans>Password for the device.</Trans>
+										</Typography>
+									</Grid>
+								</React.Fragment>
+							)}
+							<Grid item xs={12}>
+								<Accordion className="accordion">
+									<AccordionSummary elevation={0} expandIcon={<ArrowDropDownIcon />}>
+										<Typography>
+											<Trans>Advanced settings</Trans>
+										</Typography>
+									</AccordionSummary>
+									<AccordionDetails>
+										<Grid container spacing={2}>
+											{protocolClass === 'rtsp' && (
+												<React.Fragment>
+													<Grid item xs={12}>
+														<Typography variant="h3">
+															<Trans>RTSP</Trans>
+														</Typography>
+													</Grid>
+													<Grid item xs={12}>
+														<Checkbox
+															label={<Trans>UDP transport</Trans>}
+															checked={settings.rtsp.udp}
+															onChange={props.onChange('rtsp', 'udp')}
+														/>
+													</Grid>
+													<Grid item xs={12}>
+														<TextField
+															variant="outlined"
+															type="number"
+															min="0"
+															step="1"
+															fullWidth
+															label={<Trans>Socket timeout (microseconds)</Trans>}
+															value={settings.rtsp.stimeout}
+															onChange={props.onChange('rtsp', 'stimeout')}
+														/>
+													</Grid>
+												</React.Fragment>
+											)}
+											{protocolClass === 'http' && (
+												<React.Fragment>
+													<Grid item xs={12}>
+														<Typography variant="h3">
+															<Trans>HTTP and HTTPS</Trans>
+														</Typography>
+													</Grid>
+													<Grid item xs={12}>
+														<Checkbox
+															label={<Trans>Read input at native speed</Trans>}
+															checked={settings.http.readNative}
+															onChange={props.onChange('http', 'readNative')}
+														/>
+														<Checkbox
+															label={<Trans>Force input framerate</Trans>}
+															checked={settings.http.forceFramerate}
+															onChange={props.onChange('http', 'forceFramerate')}
+														/>
+													</Grid>
+													{settings.http.forceFramerate === true && (
+														<Grid item xs={12}>
+															<TextField
+																variant="outlined"
+																type="number"
+																min="0"
+																step="1"
+																fullWidth
+																label={<Trans>Framerate</Trans>}
+																value={settings.http.framerate}
+																onChange={props.onChange('http', 'framerate')}
+															/>
+														</Grid>
+													)}
+													<Grid item xs={12}>
+														<TextField
+															variant="outlined"
+															fullWidth
+															label="User-Agent"
+															value={settings.http.userAgent}
+															onChange={props.onChange('http', 'userAgent')}
+														/>
+													</Grid>
+												</React.Fragment>
+											)}
 											<Grid item xs={12}>
 												<Typography variant="h3">
-													<Trans>RTSP</Trans>
+													<Trans>General</Trans>
 												</Typography>
 											</Grid>
-											<Grid item xs={12}>
-												<Checkbox
-													label={<Trans>UDP transport</Trans>}
-													checked={settings.rtsp.udp}
-													onChange={props.onChange('rtsp', 'udp')}
-												/>
-											</Grid>
 											<Grid item xs={12}>
 												<TextField
 													variant="outlined"
@@ -499,95 +567,39 @@ function Pull(props) {
 													min="0"
 													step="1"
 													fullWidth
-													label={<Trans>Socket timeout (microseconds)</Trans>}
-													value={settings.rtsp.stimeout}
-													onChange={props.onChange('rtsp', 'stimeout')}
+													label="thread_queue_size"
+													value={settings.general.thread_queue_size}
+													onChange={props.onChange('general', 'thread_queue_size')}
 												/>
 											</Grid>
-										</React.Fragment>
-									)}
-									{protocolClass === 'http' && (
-										<React.Fragment>
-											<Grid item xs={12}>
-												<Typography variant="h3">
-													<Trans>HTTP and HTTPS</Trans>
-												</Typography>
-											</Grid>
 											<Grid item xs={12}>
-												<Checkbox
-													label={<Trans>Read input at native speed</Trans>}
-													checked={settings.http.readNative}
-													onChange={props.onChange('http', 'readNative')}
-												/>
-												<Checkbox
-													label={<Trans>Force input framerate</Trans>}
-													checked={settings.http.forceFramerate}
-													onChange={props.onChange('http', 'forceFramerate')}
-												/>
+												<MultiSelect
+													type="select"
+													label="flags"
+													value={settings.general.fflags}
+													onChange={props.onChange('general', 'fflags')}
+												>
+													<MultiSelectOption value="discardcorrupt" name="discardcorrupt" />
+													<MultiSelectOption value="fastseek" name="fastseek" />
+													<MultiSelectOption value="genpts" name="genpts" />
+													<MultiSelectOption value="igndts" name="igndts" />
+													<MultiSelectOption value="ignidx" name="ignidx" />
+													<MultiSelectOption value="nobuffer" name="nobuffer" />
+													<MultiSelectOption value="nofillin" name="nofillin" />
+													<MultiSelectOption value="noparse" name="noparse" />
+													<MultiSelectOption value="sortdts" name="sortdts" />
+												</MultiSelect>
 											</Grid>
-											{settings.http.forceFramerate === true && (
-												<Grid item xs={12}>
-													<TextField
-														variant="outlined"
-														type="number"
-														min="0"
-														step="1"
-														fullWidth
-														label={<Trans>Framerate</Trans>}
-														value={settings.http.framerate}
-														onChange={props.onChange('http', 'framerate')}
-													/>
-												</Grid>
-											)}
-											<Grid item xs={12}>
-												<TextField
-													variant="outlined"
-													fullWidth
-													label="User-Agent"
-													value={settings.http.userAgent}
-													onChange={props.onChange('http', 'userAgent')}
-												/>
-											</Grid>
-										</React.Fragment>
-									)}
-									<Grid item xs={12}>
-										<Typography variant="h3">
-											<Trans>General</Trans>
-										</Typography>
-									</Grid>
-									<Grid item xs={12}>
-										<TextField
-											variant="outlined"
-											type="number"
-											min="0"
-											step="1"
-											fullWidth
-											label="thread_queue_size"
-											value={settings.general.thread_queue_size}
-											onChange={props.onChange('general', 'thread_queue_size')}
-										/>
-									</Grid>
-									<Grid item xs={12}>
-										<MultiSelect type="select" label="flags" value={settings.general.fflags} onChange={props.onChange('general', 'fflags')}>
-											<MultiSelectOption value="discardcorrupt" name="discardcorrupt" />
-											<MultiSelectOption value="fastseek" name="fastseek" />
-											<MultiSelectOption value="genpts" name="genpts" />
-											<MultiSelectOption value="igndts" name="igndts" />
-											<MultiSelectOption value="ignidx" name="ignidx" />
-											<MultiSelectOption value="nobuffer" name="nobuffer" />
-											<MultiSelectOption value="nofillin" name="nofillin" />
-											<MultiSelectOption value="noparse" name="noparse" />
-											<MultiSelectOption value="sortdts" name="sortdts" />
-										</MultiSelect>
-									</Grid>
-								</Grid>
-							</AccordionDetails>
-						</Accordion>
-					</Grid>
+										</Grid>
+									</AccordionDetails>
+								</Accordion>
+							</Grid>
+						</React.Fragment>
+					)}
 				</React.Fragment>
 			)}
 			<Grid item xs={12}>
-				<FormInlineButton disabled={!isValidURL(settings.address) || supportedProtocol <= 0} onClick={props.onProbe}>
+				<FormInlineButton disabled={!validURL || !supportedProtocol} onClick={props.onProbe}>
 					<Trans>Probe</Trans>
 				</FormInlineButton>
 			</Grid>
diff --git a/src/views/Edit/Sources/Network.test.js b/src/views/Edit/Sources/Network.test.js
index d357cc9..8beedd0 100644
--- a/src/views/Edit/Sources/Network.test.js
+++ b/src/views/Edit/Sources/Network.test.js
@@ -52,17 +52,21 @@ test('source:network pull', async () => {
 	const Source = Network.component;
 	let { getByLabelText, queryByText, rerender } = render(<Source onChange={handleChange} />);
 
+	expect(queryByText(`This protocol is unknown or not supported by the available FFmpeg binary.`)).toBe(null);
+
 	const input = getByLabelText('Address');
 	fireEvent.change(input, { target: { value: 'rtsp://127.0.0.1/live/stream' } });
 
 	expect($settings.mode).toBe('pull');
 	expect($settings.address).toBe('rtsp://127.0.0.1/live/stream');
 
+	rerender(<Source settings={$settings} onChange={handleChange} />);
+
 	expect(queryByText(`This protocol is unknown or not supported by the available FFmpeg binary.`)).toBeInTheDocument();
 
 	rerender(<Source settings={$settings} skills={$skills_ffmpeg5} onChange={handleChange} />);
 
-	expect(queryByText(`The available FFmpeg binary doesn't support any of the required protocols.`)).toBe(null);
+	expect(queryByText(`This protocol is unknown or not supported by the available FFmpeg binary.`)).toBe(null);
 });
 
 const pullmatrix = {