13222103564

Committed 09 Feb 2025 03:48AM UTC coverage: 91.867% (+0.007%) from 91.86%

Build # 13222103564

Build Type

Pull #7394

github

Committed by

web-flow

Commit Message

Merge 3c424bbf2 into eababa4c2

Pull Request Pull Request #7394: HTML Preview of RMarkdown Submission Files

Run Details

629 of 1366 branches covered (46.05%)

Branch coverage included in aggregate %.

105 of 107 new or added lines in 9 files covered. (98.13%)

1 existing line in 1 file now uncovered.

41402 of 44386 relevant lines covered (93.28%)

120.47 hits per line

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

72.13

/app/javascript/Components/Result/file_viewer.jsx

import React from "react";

import {ImageViewer} from "./image_viewer";
import {TextViewer} from "./text_viewer";
import {PDFViewer} from "./pdf_viewer";
import {HTMLViewer} from "./html_viewer";
import {BinaryViewer} from "./binary_viewer";
import {URLViewer} from "./url_viewer";

export class FileViewer extends React.Component {
  state = {
    loading: false,
    errorMessage: null,
  };

  mounted = false;

  setLoading = loading => {
    if (this.mounted) {
      this.setState({loading: loading});
    }
  };

  setErrorMessage = message => {
    if (this.mounted) {
      this.setState({errorMessage: message});
    }
  };

  componentDidMount() {
    this.mounted = true;
  }

  componentWillUnmount() {
    this.mounted = false;
  }

  componentDidUpdate(prevProps, prevState, snapshot) {
    if (this.props !== prevProps) {
      this.setState({
        loading: false,
        errorMessage: null,
      });
    }
  }

  getViewer() {
    const commonProps = {
      submission_file_id: this.props.selectedFile,
      annotations: this.props.annotations ? this.props.annotations : [],
      released_to_students: this.props.released_to_students,
      resultView: !!this.props.result_id,
      course_id: this.props.course_id,
      key: `${this.props.selectedFileType}-viewer`,
      url: this.props.selectedFileURL,
      setLoadingCallback: this.setLoading,
      setErrorMessageCallback: this.setErrorMessage,
    };

    if (this.props.selectedFileType === "image") {
      return <ImageViewer mime_type={this.props.mime_type} {...commonProps} />;
    } else if (this.props.selectedFileType === "pdf") {
      return <PDFViewer annotationFocus={this.props.annotationFocus} {...commonProps} />;
    } else if (
      this.props.selectedFileType === "jupyter-notebook" ||
      (this.props.selectedFileType === "markdown" && this.props.rmd_convert_enabled)
    ) {
      return <HTMLViewer annotationFocus={this.props.annotationFocus} {...commonProps} />;
    } else if (this.props.selectedFileType === "binary") {
      return <BinaryViewer content={this.state.content} {...commonProps} />;
    } else if (this.props.selectedFileType === "markusurl") {
      return <URLViewer externalUrl={this.state.content} {...commonProps} />;
    } else if (this.props.selectedFileType !== "") {
      return (
        <TextViewer
          type={this.props.selectedFileType}
          focusLine={this.props.focusLine}
          {...commonProps}
        />
      );
    } else {
      return "";
    }
  }

  render() {
    const viewer = this.getViewer();
    const outerDivStyle = {
      display: this.state.loading || this.state.errorMessage ? "none" : "block",
      height: "100%",
    };
    return (
      <React.Fragment>
        <div style={outerDivStyle}>{viewer}</div>
        {this.state.errorMessage && <p>{this.state.errorMessage}</p>}
        {this.state.loading && !this.state.errorMessage && <p>{I18n.t("working")}</p>}
      </React.Fragment>
    );
  }
}

1	import React from "react";
2
3	import {ImageViewer} from "./image_viewer";
4	import {TextViewer} from "./text_viewer";
5	import {PDFViewer} from "./pdf_viewer";
6	import {HTMLViewer} from "./html_viewer";
7	import {BinaryViewer} from "./binary_viewer";
8	import {URLViewer} from "./url_viewer";
9
10	export class FileViewer extends React.Component {
11	state = {	3✔
12	loading: false,
13	errorMessage: null,
14	};
15
16	mounted = false;	3✔
17
18	setLoading = loading => {	3✔
19	if (this.mounted) {	10✔
20	this.setState({loading: loading});	7✔
21	}
22	};
23
24	setErrorMessage = message => {	3✔
25	if (this.mounted) {	1!
26	this.setState({errorMessage: message});	1✔
27	}
28	};
29
30	componentDidMount() {
31	this.mounted = true;	3✔
32	}
33
34	componentWillUnmount() {
35	this.mounted = false;	3✔
36	}
37
38	componentDidUpdate(prevProps, prevState, snapshot) {
39	if (this.props !== prevProps) {	9✔
40	this.setState({	2✔
41	loading: false,
42	errorMessage: null,
43	});
44	}
45	}
46
47	getViewer() {
48	const commonProps = {	12✔
49	submission_file_id: this.props.selectedFile,
50	annotations: this.props.annotations ? this.props.annotations : [],	12!
51	released_to_students: this.props.released_to_students,
52	resultView: !!this.props.result_id,
53	course_id: this.props.course_id,
54	key: `${this.props.selectedFileType}-viewer`,
55	url: this.props.selectedFileURL,
56	setLoadingCallback: this.setLoading,
57	setErrorMessageCallback: this.setErrorMessage,
58	};
59
60	if (this.props.selectedFileType === "image") {	12!
61	return <ImageViewer mime_type={this.props.mime_type} {...commonProps} />;	×
62	} else if (this.props.selectedFileType === "pdf") {	12!
63	return <PDFViewer annotationFocus={this.props.annotationFocus} {...commonProps} />;	×
64	} else if (	12!
65	this.props.selectedFileType === "jupyter-notebook" \|\|	24!
66	(this.props.selectedFileType === "markdown" && this.props.rmd_convert_enabled)
67	) {
UNCOV 68	return <HTMLViewer annotationFocus={this.props.annotationFocus} {...commonProps} />;	×
69	} else if (this.props.selectedFileType === "binary") {	12!
70	return <BinaryViewer content={this.state.content} {...commonProps} />;	×
71	} else if (this.props.selectedFileType === "markusurl") {	12!
72	return <URLViewer externalUrl={this.state.content} {...commonProps} />;	×
73	} else if (this.props.selectedFileType !== "") {	12!
74	return (	12✔
75	<TextViewer
76	type={this.props.selectedFileType}
77	focusLine={this.props.focusLine}
78	{...commonProps}
79	/>
80	);
81	} else {
82	return "";	×
83	}
84	}
85
86	render() {
87	const viewer = this.getViewer();	12✔
88	const outerDivStyle = {	12✔
89	display: this.state.loading \|\| this.state.errorMessage ? "none" : "block",	36✔
90	height: "100%",
91	};
92	return (	12✔
93	<React.Fragment>
94	<div style={outerDivStyle}>{viewer}</div>
95	{this.state.errorMessage && <p>{this.state.errorMessage}</p>}	13✔
96	{this.state.loading && !this.state.errorMessage && <p>{I18n.t("working")}</p>}	12!
97	</React.Fragment>
98	);
99	}
100	}

MarkUsProject / Markus / 13222103564

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