19681125432

Committed 25 Nov 2025 07:08PM UTC coverage: 91.532%. Remained the same

Build # 19681125432

Build Type

push

github

Committed by

web-flow

Commit Message

Split test_run_table.jsx into separate component files (#7739)

Run Details

905 of 1801 branches covered (50.25%)

Branch coverage included in aggregate %.

60 of 84 new or added lines in 2 files covered. (71.43%)

1 existing line in 1 file now uncovered.

43533 of 46748 relevant lines covered (93.12%)

121.84 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

45.74

/app/javascript/Components/test_run_table.jsx

import React from "react";
import {createRoot} from "react-dom/client";
import ReactTable from "react-table";
import {dateSort} from "./Helpers/table_helpers";
import consumer from "../channels/consumer";
import {renderFlashMessages} from "../common/flash";
import {TestGroupResultTable} from "./test_group_result_table";

export class TestRunTable extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: [],
      loading: true,
      expanded: {},
    };
    this.testRuns = React.createRef();
  }

  componentDidMount() {
    this.fetchData();
    this.create_test_runs_channel_subscription();
  }

  componentDidUpdate(prevProps) {
    if (
      prevProps.result_id !== this.props.result_id ||
      prevProps.instructor_run !== this.props.instructor_run ||
      prevProps.instructor_view !== this.props.instructor_view
    ) {
      this.setState({loading: true}, this.fetchData);
    }
  }

  fetchData = () => {
    let fetchDetails = {
      headers: {
        Accept: "application/json",
      },
    };
    let url;
    if (this.props.instructor_run) {
      if (this.props.instructor_view) {
        url = Routes.get_test_runs_instructors_course_result_path(
          this.props.course_id,
          this.props.result_id
        );
      } else {
        url = Routes.get_test_runs_instructors_released_course_result_path(
          this.props.course_id,
          this.props.result_id
        );
      }
    } else {
      url = Routes.get_test_runs_students_course_assignment_automated_tests_path(
        this.props.course_id,
        this.props.assignment_id
      );
    }
    fetch(url, fetchDetails)
      .then(response => {
        if (response.ok) {
          return response.json();
        }
      })
      .then(data => {
        this.setState({
          data: data,
          loading: false,
          expanded: data.length > 0 ? {0: true} : {},
        });
      });
  };

  onExpandedChange = newExpanded => this.setState({expanded: newExpanded});

  create_test_runs_channel_subscription = () => {
    consumer.subscriptions.create(
      {
        channel: "TestRunsChannel",
        course_id: this.props.course_id,
        assignment_id: this.props.assignment_id,
        grouping_id: this.props.grouping_id,
        submission_id: this.props.submission_id,
      },
      {
        connected: () => {},
        disconnected: () => {},
        received: data => {
          // Called when there's incoming data on the websocket for this channel
          if (data["status"] !== null) {
            let message_data = generateMessage(data);
            renderFlashMessages(message_data);
          }
          if (data["status"] === "completed") {
            // Note: this gets called after AutotestRunJob completes (when a new
            // TestRun is created), and after an AutotestResultsJob completed
            // (when test results are available).
            this.fetchData();
          }
        },
      }
    );
  };

  render() {
    let height;
    if (this.props.instructor_view) {
      // 3.5em is the vertical space for the action bar (and run tests button)
      height = "calc(599px - 3.5em)";
    } else {
      height = "599px";
    }

    return (
      <div>
        <ReactTable
          ref={this.testRuns}
          data={this.state.data}
          key={this.state.data.length ? this.state.data[0]["test_runs.id"] : "empty-table"}
          columns={[
            {
              id: "created_at",
              accessor: row => row["test_runs.created_at"],
              sortMethod: dateSort,
              minWidth: 300,
            },
            {
              id: "user_name",
              accessor: row => row["users.user_name"],
              Cell: ({value}) => I18n.t("activerecord.attributes.test_run.user") + " " + value,
              show: !this.props.instructor_run || this.props.instructor_view,
              width: 120,
            },
            {
              id: "status",
              accessor: row =>
                I18n.t(`automated_tests.test_runs_statuses.${row["test_runs.status"]}`),
              width: 120,
            },
          ]}
          SubComponent={row =>
            row.original["test_runs.problems"] ? (
              <pre>{row.original["test_runs.problems"]}</pre>
            ) : (
              <TestGroupResultTable
                key={row.original.id_}
                data={row.original["test_results"]}
                course_id={this.props.course_id}
              />
            )
          }
          noDataText={I18n.t("automated_tests.no_results")}
          getTheadProps={() => {
            return {
              style: {display: "none"},
            };
          }}
          defaultSorted={[{id: "created_at", desc: true}]}
          expanded={this.state.expanded}
          onExpandedChange={this.onExpandedChange}
          loading={this.state.loading}
          style={{maxHeight: height}}
        />
      </div>
    );
  }
}

export function makeTestRunTable(elem, props) {
  const root = createRoot(elem);
  root.render(<TestRunTable {...props} />);
}

function generateMessage(status_data) {
  let message_data = {};
  switch (status_data["status"]) {
    case "failed":
      if (!status_data["exception"] || !status_data["exception"]["message"]) {
        message_data["error"] = I18n.t("job.status.failed.no_message");
      } else {
        message_data["error"] = I18n.t("job.status.failed.message", {
          error: status_data["exception"]["message"],
        });
      }
      break;
    case "completed":
      if (status_data["job_class"] === "AutotestRunJob") {
        message_data["success"] = I18n.t("automated_tests.autotest_run_job.status.completed");
      } else {
        message_data["success"] = I18n.t("automated_tests.autotest_results_job.status.completed");
      }
      break;
    case "queued":
      message_data["notice"] = I18n.t("job.status.queued");
      break;
    case "service_unavailable":
      message_data["notice"] = status_data["exception"]["message"];
      break;
    default:
      message_data["notice"] = I18n.t("automated_tests.autotest_run_job.status.in_progress");
  }
  if (status_data["warning_message"]) {
    message_data["warning"] = status_data["warning_message"];
  }
  return message_data;
}

1	import React from "react";
2	import {createRoot} from "react-dom/client";
3	import ReactTable from "react-table";
4	import {dateSort} from "./Helpers/table_helpers";
5	import consumer from "../channels/consumer";
6	import {renderFlashMessages} from "../common/flash";
7	import {TestGroupResultTable} from "./test_group_result_table";
8
9	export class TestRunTable extends React.Component {
10	constructor(props) {
11	super(props);	12✔
12	this.state = {	11✔
13	data: [],
14	loading: true,
15	expanded: {},
16	};
17	this.testRuns = React.createRef();	11✔
18	}
19
20	componentDidMount() {
21	this.fetchData();	11✔
22	this.create_test_runs_channel_subscription();	11✔
23	}
24
25	componentDidUpdate(prevProps) {
26	if (	11!
27	prevProps.result_id !== this.props.result_id \|\|	33✔
28	prevProps.instructor_run !== this.props.instructor_run \|\|
29	prevProps.instructor_view !== this.props.instructor_view
30	) {
31	this.setState({loading: true}, this.fetchData);	×
32	}
33	}
34
35	fetchData = () => {	11✔
36	let fetchDetails = {	11✔
37	headers: {
38	Accept: "application/json",
39	},
40	};
41	let url;
42	if (this.props.instructor_run) {	11!
43	if (this.props.instructor_view) {	11!
44	url = Routes.get_test_runs_instructors_course_result_path(	11✔
45	this.props.course_id,
46	this.props.result_id
47	);
48	} else {
49	url = Routes.get_test_runs_instructors_released_course_result_path(	×
50	this.props.course_id,
51	this.props.result_id
52	);
53	}
54	} else {
55	url = Routes.get_test_runs_students_course_assignment_automated_tests_path(	×
56	this.props.course_id,
57	this.props.assignment_id
58	);
59	}
60	fetch(url, fetchDetails)	11✔
61	.then(response => {
62	if (response.ok) {	11!
63	return response.json();	11✔
64	}
65	})
66	.then(data => {
67	this.setState({	11✔
68	data: data,
69	loading: false,
70	expanded: data.length > 0 ? {0: true} : {},	11✔
71	});
72	});
73	};
74
75	onExpandedChange = newExpanded => this.setState({expanded: newExpanded});	11✔
76
77	create_test_runs_channel_subscription = () => {	11✔
78	consumer.subscriptions.create(	11✔
79	{
80	channel: "TestRunsChannel",
81	course_id: this.props.course_id,
82	assignment_id: this.props.assignment_id,
83	grouping_id: this.props.grouping_id,
84	submission_id: this.props.submission_id,
85	},
86	{
87	connected: () => {},
88	disconnected: () => {},
89	received: data => {
90	// Called when there's incoming data on the websocket for this channel
91	if (data["status"] !== null) {	×
92	let message_data = generateMessage(data);	×
93	renderFlashMessages(message_data);	×
94	}
95	if (data["status"] === "completed") {	×
96	// Note: this gets called after AutotestRunJob completes (when a new
97	// TestRun is created), and after an AutotestResultsJob completed
98	// (when test results are available).
99	this.fetchData();	×
100	}
101	},
102	}
103	);
104	};
105
106	render() {
107	let height;
108	if (this.props.instructor_view) {	22!
109	// 3.5em is the vertical space for the action bar (and run tests button)
110	height = "calc(599px - 3.5em)";	22✔
111	} else {
112	height = "599px";	×
113	}
114
115	return (	22✔
116	<div>
117	<ReactTable
118	ref={this.testRuns}
119	data={this.state.data}
120	key={this.state.data.length ? this.state.data[0]["test_runs.id"] : "empty-table"}	22✔
121	columns={[
122	{
123	id: "created_at",
124	accessor: row => row["test_runs.created_at"],	10✔
125	sortMethod: dateSort,
126	minWidth: 300,
127	},
128	{
129	id: "user_name",
130	accessor: row => row["users.user_name"],	10✔
131	Cell: ({value}) => I18n.t("activerecord.attributes.test_run.user") + " " + value,	10✔
132	show: !this.props.instructor_run \|\| this.props.instructor_view,	44✔
133	width: 120,
134	},
135	{
136	id: "status",
137	accessor: row =>
138	I18n.t(`automated_tests.test_runs_statuses.${row["test_runs.status"]}`),	10✔
139	width: 120,
140	},
141	]}
142	SubComponent={row =>
143	row.original["test_runs.problems"] ? (	10✔
144	<pre>{row.original["test_runs.problems"]}</pre>
145	) : (
146	<TestGroupResultTable
147	key={row.original.id_}
148	data={row.original["test_results"]}
149	course_id={this.props.course_id}
150	/>
151	)
152	}
153	noDataText={I18n.t("automated_tests.no_results")}
154	getTheadProps={() => {
155	return {	23✔
156	style: {display: "none"},
157	};
158	}}
159	defaultSorted={[{id: "created_at", desc: true}]}
160	expanded={this.state.expanded}
161	onExpandedChange={this.onExpandedChange}
162	loading={this.state.loading}
163	style={{maxHeight: height}}
164	/>
165	</div>
166	);
167	}
168	}
169
170	export function makeTestRunTable(elem, props) {
UNCOV 171	const root = createRoot(elem);	×
172	root.render(<TestRunTable {...props} />);	×
173	}
174
175	function generateMessage(status_data) {
176	let message_data = {};	×
177	switch (status_data["status"]) {	×
178	case "failed":
179	if (!status_data["exception"] \|\| !status_data["exception"]["message"]) {	×
180	message_data["error"] = I18n.t("job.status.failed.no_message");	×
181	} else {
182	message_data["error"] = I18n.t("job.status.failed.message", {	×
183	error: status_data["exception"]["message"],
184	});
185	}
186	break;	×
187	case "completed":
188	if (status_data["job_class"] === "AutotestRunJob") {	×
189	message_data["success"] = I18n.t("automated_tests.autotest_run_job.status.completed");	×
190	} else {
191	message_data["success"] = I18n.t("automated_tests.autotest_results_job.status.completed");	×
192	}
193	break;	×
194	case "queued":
195	message_data["notice"] = I18n.t("job.status.queued");	×
196	break;	×
197	case "service_unavailable":
198	message_data["notice"] = status_data["exception"]["message"];	×
199	break;	×
200	default:
201	message_data["notice"] = I18n.t("automated_tests.autotest_run_job.status.in_progress");	×
202	}
203	if (status_data["warning_message"]) {	×
204	message_data["warning"] = status_data["warning_message"];	×
205	}
206	return message_data;	×
207	}

MarkUsProject / Markus / 19681125432

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous