Skip to content

Commit

Permalink
Merge pull request #146 from ligangty/main
Browse files Browse the repository at this point in the history
Add unit test for RemoteEdit
  • Loading branch information
ligangty authored Jan 9, 2024
2 parents ebb8cd2 + 4bfd255 commit 640d2ab
Show file tree
Hide file tree
Showing 4 changed files with 181 additions and 51 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@

import React from "react";
import {MemoryRouter, Route, Routes} from 'react-router-dom';
import {render, screen, cleanup, waitFor, within} from '@testing-library/react';
import {render, screen, cleanup, waitFor} from '@testing-library/react';
import '@testing-library/jest-dom';
import fetchMock from "fetch-mock";
import GroupView from "./GroupView.jsx";
Expand Down
93 changes: 44 additions & 49 deletions src/main/webui/src/app/components/content/remote/RemoteEdit.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -29,46 +29,6 @@ import {PATTERNS} from "../../ComponentConstants.js";

const {storeRes, disableRes} = IndyRest;

const CertificateSection = ({store, register}) => <div className="sub-fields">
{
store.useAuth &&
<div className="detail-field">
<label>Client Key Password:</label>
<input type="password" defaultValue={store.key_password} {...register("key_password")} /><Hint hintKey="client_key" />
</div>
}
<div className="fieldset two-col">
{
store.useAuth &&
<div className="left-col">
<div className="textarea-label">
<label>Client Key</label><span className="hint">(PEM Format)</span>
</div>
{
// 64 columns is the original PEM line-length spec
}
<textarea className="cert" cols="68" defaultValue={store.key_certificate_pem} {...register("key_certificate_pem")}>
</textarea>
</div>
}
<div className="right-col">
<div className="textarea-label">
<label>Server Certificate</label><span className="hint">(PEM Format)</span>
</div>
{
// 64 columns is the original PEM line-length spec
}
<textarea className="cert" cols="68" defaultValue={store.server_certificate_pem} {...register("server_certificate_pem")}>
</textarea>
</div>
</div>
</div>;

CertificateSection.propTypes = {
store: PropTypes.object.isRequired,
register: PropTypes.func
};

export default function RemoteEdit() {
const [state, setState] = useState({
store: {},
Expand Down Expand Up @@ -119,9 +79,9 @@ export default function RemoteEdit() {
store: raw
});
reset(raw);
setUseProxy(storeView.useProxy);
setUseAuth(storeView.useAuth);
setUseX509(storeView.useX509);
setUseProxy(cloned.useProxy);
setUseAuth(cloned.useAuth);
setUseX509(cloned.useX509);
}else{
// TODO: find another way to do error handling
Utils.logMessage(`Failed to get store data. Error reason: ${res.error.status}->${res.error.message}`);
Expand All @@ -132,8 +92,10 @@ export default function RemoteEdit() {
}
}, [packageType, name, mode, reset]);

let storeView = {};
if (mode === 'edit'){
store = state.store;
storeView = state.storeView;
}

const handleUseProxy = event=>{
Expand Down Expand Up @@ -290,7 +252,7 @@ export default function RemoteEdit() {
// HTTP Proxy
}
<div className="detail-field">
<input type="checkbox" defaultChecked={useProxy} onChange={e=>handleUseProxy(e)} />{' '}
<input type="checkbox" defaultChecked={storeView.useProxy} onChange={e=>handleUseProxy(e)} />{' '}
<label>Use Proxy?</label>
</div>
{
Expand All @@ -310,7 +272,7 @@ export default function RemoteEdit() {
// X.509 / auth
}
<div className="detail-field">
<input type="checkbox" defaultChecked={useAuth} onChange={e=>handleUseAuth(e)} />{' '}
<input type="checkbox" defaultChecked={storeView.useAuth} onChange={e=>handleUseAuth(e)} />{' '}
<label>Use Authentication?</label>
</div>
{
Expand All @@ -322,7 +284,7 @@ export default function RemoteEdit() {
</div>
<div className="detail-field">
<label>Password:</label>
<input type="password" size="25" defaultValue={store.password} {...register("password")} />
<input type="password" size="25" role="password" defaultValue={store.password} {...register("password")} />
</div>
{
store.use_proxy && <React.Fragment>
Expand All @@ -332,18 +294,51 @@ export default function RemoteEdit() {
</div>
<div className="detail-field">
<label>Proxy Password:</label>
<input type="password" size="20" defaultValue={store.proxy_password} {...register("proxy_password")} />
<input type="password" role="password" size="20" defaultValue={store.proxy_password} {...register("proxy_password")} />
</div>
</React.Fragment>
}
</div>
}
<div className="detail-field">
<input type="checkbox" defaultChecked={useX509} onChange={e=>handleUseX509(e)} />{' '}
<input type="checkbox" defaultChecked={storeView.useX509} onChange={e=>handleUseX509(e)} />{' '}
<label>{`Use Custom X.509 Configuration?`}</label>
</div>
{
useX509 && <CertificateSection store={store} register={register} />
useX509 && <div className="sub-fields">
{
useAuth &&
<div className="detail-field">
<label>Client Key Password:</label>
<input type="password" role="password" defaultValue={store.key_password} {...register("key_password")} /><Hint hintKey="client_key" />
</div>
}
<div className="fieldset two-col">
{
useAuth &&
<div className="left-col">
<div className="textarea-label">
<label>Client Key</label><span className="hint">(PEM Format)</span>
</div>
{
// 64 columns is the original PEM line-length spec
}
<textarea className="cert" cols="68" defaultValue={store.key_certificate_pem} {...register("key_certificate_pem")}>
</textarea>
</div>
}
<div className="right-col">
<div className="textarea-label">
<label>Server Certificate</label><span className="hint">(PEM Format)</span>
</div>
{
// 64 columns is the original PEM line-length spec
}
<textarea className="cert" cols="68" defaultValue={store.server_certificate_pem} {...register("server_certificate_pem")}>
</textarea>
</div>
</div>
</div>
}
</div>
</div>
Expand Down
134 changes: 134 additions & 0 deletions src/main/webui/src/app/components/content/remote/RemoteEdit.test.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@
/* eslint-disable camelcase */
/**
* Copyright (C) 2023 Red Hat, Inc. (https://github.com/Commonjava/indy-ui-service)
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

import React from "react";
import {MemoryRouter, Route, Routes} from 'react-router-dom';
import {render, screen, cleanup, waitFor, within} from '@testing-library/react';
import '@testing-library/jest-dom';
import fetchMock from "fetch-mock";
import RemoteEdit from "./RemoteEdit.jsx";
import {STORE_API_BASE_URL} from "../../ComponentConstants.js";

beforeEach(()=>{
fetchMock.restore();
fetchMock.mock(
"/api/stats/package-type/keys",
{status: 200, body: JSON.stringify(["maven", "npm", "generic-http"])}
);
});

afterEach(() => {
cleanup();
});

describe('RemoteEdit tests', () => {
it("Verify RemoteEdit for new mode", async ()=>{
render(<MemoryRouter initialEntries={["/remote/new"]}>
<Routes>
<Route path="/remote/new" element={<RemoteEdit />} />
</Routes>
</MemoryRouter>);

await waitFor(() => {
// ListControl section testing
expect(screen.getByRole("button", {name: "Save"})).toBeInTheDocument();
expect(screen.getByRole("button", {name: "Cancel"})).toBeInTheDocument();

// Basic section testing
expect(screen.getByRole("option", {name: "maven"})).toBeInTheDocument();
expect(screen.getByRole("option", {name: "npm"})).toBeInTheDocument();
expect(screen.getByRole("option", {name: "generic-http"})).toBeInTheDocument();
expect(screen.getByRole("option", {name: ""}).selected).toBe(true);
expect(screen.getByRole("pkgTypeSel")).toHaveValue("");

expect(screen.getByText("Name:")).toBeInTheDocument();
let parentDiv = screen.getByText("Name:").closest("div");
expect(within(parentDiv).getByRole("textbox")).toHaveAttribute("name", "name");
expect(screen.getByText("Enabled?")).toBeInTheDocument();
parentDiv = screen.getByText("Enabled?").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toHaveAttribute("name", "enabled");
expect(screen.getByText("Authoritative content Index?")).toBeInTheDocument();
parentDiv = screen.getByText("Authoritative content Index?").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toHaveAttribute("name", "authoritative_index");

// Capabilities section testing
parentDiv = screen.getByText("Allow Releases").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toHaveAttribute("name", "allow_releases");
parentDiv = screen.getByText("Allow Snapshots").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toHaveAttribute("name", "allow_snapshots");

});
});

it("Verify RemoteEdit for edit mode", async ()=>{
const mockRemoteStore = {name: "central", type: "remote", packageType: "maven",
key: "maven:remote:central", disabled: false, "allow_snapshots": true,
"allow_releases": true, url: "https://repo.maven.apache.org/maven2/",
authoritative_index: true, description: "official maven central",
server_certificate_pem: "lksjdflksjdfl", key_certificate_pem: "kjlkjlkjlsdfsdf",
key_password: "654321",
proxy_host: "https://test.proxy.server/", proxy_port: 8010,
user: "testuser", password: "123456"};
const mockDisableTimeout = {name: "Disable-Timeout", group: "maven:remote:central#Disable-Timeout",
expiration: "2030-02-22T17:00:00.000Z"};
fetchMock.mock(`${STORE_API_BASE_URL}/maven/remote/central`, {status: 200, body: JSON.stringify(mockRemoteStore)});
fetchMock.mock("/api/admin/schedule/store/maven/remote/central/disable-timeout", {status: 200, body: JSON.stringify(mockDisableTimeout)});
render(<MemoryRouter initialEntries={["/remote/maven/edit/central"]}>
<Routes>
<Route path="/remote/:packageType/edit/:name" element={<RemoteEdit />} />
</Routes>
</MemoryRouter>);

await waitFor(() => {
expect(screen.getByText("Package Type:")).toBeInTheDocument();
expect(screen.getByText(mockRemoteStore.packageType, {selector: "span"})).toBeInTheDocument();
expect(screen.getByText("Name:")).toBeInTheDocument();
expect(screen.getByText(mockRemoteStore.name, {selector: "span"})).toBeInTheDocument();
expect(screen.getByText("Enabled?")).toBeInTheDocument();
let parentDiv = screen.getByText("Enabled?").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toHaveAttribute("name", "enabled");
parentDiv = screen.getByText("Authoritative content Index?").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toBeChecked();

// Capabilities section testing
parentDiv = screen.getByText("Allow Releases").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toBeChecked();
parentDiv = screen.getByText("Allow Snapshots").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toBeChecked();

// Remote access section testing
parentDiv = screen.getByText("Use Proxy?").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toBeChecked();
parentDiv = screen.getByText("Proxy Host:").closest("div");
expect(within(parentDiv).getByRole("textbox")).toHaveValue(mockRemoteStore.proxy_host);
parentDiv = screen.getByText("Proxy Port:").closest("div");
expect(within(parentDiv).getByRole("textbox")).toHaveValue(`${mockRemoteStore.proxy_port}`);
parentDiv = screen.getByText("Use Authentication?").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toBeChecked();
parentDiv = screen.getByText("Username:").closest("div");
expect(within(parentDiv).getByRole("textbox")).toHaveValue(mockRemoteStore.user);
parentDiv = screen.getByText("Password:").closest("div");
expect(within(parentDiv).getByRole("password")).toHaveValue(`${mockRemoteStore.password}`);
parentDiv = screen.getByText("Use Custom X.509 Configuration?").closest("div");
expect(within(parentDiv).getByRole("checkbox")).toBeChecked();
parentDiv = screen.getByText("Client Key Password:").closest("div");
expect(within(parentDiv).getByRole("password")).toHaveValue(mockRemoteStore.key_password);
expect(screen.getByText(mockRemoteStore.key_certificate_pem)).toHaveValue(`${mockRemoteStore.key_certificate_pem}`);
expect(screen.getByText(mockRemoteStore.server_certificate_pem)).toHaveValue(`${mockRemoteStore.server_certificate_pem}`);
});
});
});
3 changes: 2 additions & 1 deletion src/main/webui/src/server/mock/list/FakeMavenRemoteList.json
Original file line number Diff line number Diff line change
Expand Up @@ -320,7 +320,8 @@
"is_passthrough" : false,
"cache_timeout_seconds" : 0,
"metadata_timeout_seconds" : 86400,
"proxy_port" : 0,
"proxy_port" : 8090,
"proxy_host" : "http://test.proxy.com",
"prefetch_priority" : 0,
"prefetch_rescan" : false,
"prefetch_listing_type" : "html"
Expand Down

0 comments on commit 640d2ab

Please sign in to comment.