OSMD_Test.ts 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388
  1. import chai = require("chai");
  2. import { OpenSheetMusicDisplay } from "../../../src/OpenSheetMusicDisplay/OpenSheetMusicDisplay";
  3. import { TestUtils } from "../../Util/TestUtils";
  4. import { VoiceEntry, Instrument, Note, Staff, Voice, GraphicalStaffEntry, GraphicalNote,
  5. Fraction, Pitch, AccidentalEnum, DrawingParametersEnum, IOSMDOptions } from "../../../src";
  6. describe("OpenSheetMusicDisplay Main Export", () => {
  7. let container1: HTMLElement;
  8. it("no container", (done: Mocha.Done) => {
  9. chai.expect(() => {
  10. return new OpenSheetMusicDisplay(undefined);
  11. }).to.throw(/container/);
  12. done();
  13. });
  14. it("container", (done: Mocha.Done) => {
  15. const div: HTMLElement = TestUtils.getDivElement(document);
  16. chai.expect(() => {
  17. return new OpenSheetMusicDisplay(div);
  18. }).to.not.throw(Error);
  19. done();
  20. });
  21. it("multiple instances", () => {
  22. const musicSheetFragmentContainer: HTMLElement = TestUtils.getDivElement(document);
  23. const fullMusicSheetContainer: HTMLElement = TestUtils.getDivElement(document);
  24. const musicSheetFragmentOptions: IOSMDOptions = {
  25. drawComposer: false,
  26. drawCredits: false,
  27. drawFingerings: false,
  28. drawHiddenNotes: false,
  29. drawLyricist: false,
  30. drawPartAbbreviations: false,
  31. drawPartNames: false,
  32. drawSubtitle: false,
  33. drawTitle: false,
  34. drawUpToMeasureNumber: 1,
  35. drawingParameters: DrawingParametersEnum.compact
  36. };
  37. const fullMusicSheetOptions: IOSMDOptions = {
  38. drawUpToMeasureNumber: 10
  39. };
  40. const musicSheetFragment: OpenSheetMusicDisplay = new OpenSheetMusicDisplay(
  41. musicSheetFragmentContainer,
  42. musicSheetFragmentOptions
  43. );
  44. const fullMusicSheet: OpenSheetMusicDisplay = new OpenSheetMusicDisplay(fullMusicSheetContainer, fullMusicSheetOptions);
  45. const musicSheet: Document = TestUtils.getScore("MuzioClementi_SonatinaOpus36No1_Part1.xml");
  46. const musicSheetXML: string = new XMLSerializer().serializeToString(musicSheet);
  47. return musicSheetFragment.load(musicSheetXML)
  48. .then(() => {
  49. musicSheetFragment.render();
  50. return fullMusicSheet.load(musicSheetXML);
  51. })
  52. .then(() => {
  53. fullMusicSheet.render();
  54. // Verify that the music sheet fragment has its options set correctly.
  55. chai.expect(musicSheetFragment.Sheet.Rules.RenderComposer).to.equal(musicSheetFragmentOptions.drawComposer);
  56. chai.expect(musicSheetFragment.Sheet.Rules.RenderFingerings).to.equal(musicSheetFragmentOptions.drawFingerings);
  57. chai.expect(musicSheetFragment.Sheet.Rules.RenderLyricist).to.equal(musicSheetFragmentOptions.drawLyricist);
  58. chai.expect(musicSheetFragment.Sheet.Rules.RenderPartAbbreviations).to.equal(musicSheetFragmentOptions.drawPartAbbreviations);
  59. chai.expect(musicSheetFragment.Sheet.Rules.RenderPartNames).to.equal(musicSheetFragmentOptions.drawPartNames);
  60. chai.expect(musicSheetFragment.Sheet.Rules.RenderSubtitle).to.equal(musicSheetFragmentOptions.drawSubtitle);
  61. chai.expect(musicSheetFragment.Sheet.Rules.RenderTitle).to.equal(musicSheetFragmentOptions.drawTitle);
  62. chai.expect(musicSheetFragment.Sheet.Rules.MaxMeasureToDrawIndex).to.equal(musicSheetFragmentOptions.drawUpToMeasureNumber - 1);
  63. // Verify that the full music sheet has its options set correctly.
  64. chai.expect(fullMusicSheet.Sheet.Rules.RenderComposer).to.not.equal(musicSheetFragmentOptions.drawComposer);
  65. chai.expect(fullMusicSheet.Sheet.Rules.RenderFingerings).to.not.equal(musicSheetFragmentOptions.drawFingerings);
  66. chai.expect(fullMusicSheet.Sheet.Rules.RenderLyricist).to.not.equal(musicSheetFragmentOptions.drawLyricist);
  67. chai.expect(fullMusicSheet.Sheet.Rules.RenderPartAbbreviations).to.not.equal(musicSheetFragmentOptions.drawPartAbbreviations);
  68. chai.expect(fullMusicSheet.Sheet.Rules.RenderPartNames).to.not.equal(musicSheetFragmentOptions.drawPartNames);
  69. chai.expect(fullMusicSheet.Sheet.Rules.RenderSubtitle).to.not.equal(musicSheetFragmentOptions.drawSubtitle);
  70. chai.expect(fullMusicSheet.Sheet.Rules.RenderTitle).to.not.equal(musicSheetFragmentOptions.drawTitle);
  71. chai.expect(fullMusicSheet.Sheet.Rules.MaxMeasureToDrawIndex).to.equal(fullMusicSheetOptions.drawUpToMeasureNumber - 1);
  72. });
  73. });
  74. it("load MXL from string", (done: Mocha.Done) => {
  75. const mxl: string = TestUtils.getMXL("Mozart_Clarinet_Quintet_Excerpt.mxl");
  76. const div: HTMLElement = TestUtils.getDivElement(document);
  77. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  78. opensheetmusicdisplay.load(mxl).then(
  79. (_: {}) => {
  80. opensheetmusicdisplay.render();
  81. done();
  82. },
  83. done
  84. );
  85. });
  86. it("load invalid MXL from string", (done: Mocha.Done) => {
  87. const mxl: string = "\x50\x4b\x03\x04";
  88. const div: HTMLElement = TestUtils.getDivElement(document);
  89. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  90. opensheetmusicdisplay.load(mxl).then(
  91. (_: {}) => {
  92. done(new Error("Corrupted MXL appears to be loaded correctly"));
  93. },
  94. (exc: Error) => {
  95. if (exc.message.toLowerCase().match(/invalid/)) {
  96. done();
  97. } else {
  98. done(new Error("Unexpected error: " + exc.message));
  99. }
  100. }
  101. );
  102. });
  103. it("load XML string", (done: Mocha.Done) => {
  104. const score: Document = TestUtils.getScore("MuzioClementi_SonatinaOpus36No1_Part1.xml");
  105. const xml: string = new XMLSerializer().serializeToString(score);
  106. const div: HTMLElement = TestUtils.getDivElement(document);
  107. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  108. opensheetmusicdisplay.load(xml).then(
  109. (_: {}) => {
  110. opensheetmusicdisplay.render();
  111. done();
  112. },
  113. done
  114. );
  115. });
  116. it("load XML Document", (done: Mocha.Done) => {
  117. const score: Document = TestUtils.getScore("MuzioClementi_SonatinaOpus36No1_Part1.xml");
  118. const div: HTMLElement = TestUtils.getDivElement(document);
  119. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  120. opensheetmusicdisplay.load(score).then(
  121. (_: {}) => {
  122. opensheetmusicdisplay.render();
  123. done();
  124. },
  125. done
  126. );
  127. });
  128. it.skip("Timeout from server", (done: Mocha.Done) => {
  129. // TODO this test times out from time to time, even with osmd.loadUrlTimeout set to 5000.
  130. // the test is unreliable, which makes it hard to test.
  131. // also, it's better not to use OSMD to fetch one's score anyways.
  132. // also, the timeout adds unnecessary time to the testing suite.
  133. const score: string = "https://httpstat.us/408";
  134. const div: HTMLElement = TestUtils.getDivElement(document);
  135. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  136. opensheetmusicdisplay.load(score).then(
  137. (_: {}) => {
  138. done(new Error("Unexpected response from server"));
  139. },
  140. (exc: Error) => {
  141. done();
  142. }
  143. );
  144. });
  145. it("load MXL Document by URL", (done: Mocha.Done) => {
  146. const url: string = "base/test/data/Mozart_Clarinet_Quintet_Excerpt.mxl";
  147. const div: HTMLElement = TestUtils.getDivElement(document);
  148. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  149. opensheetmusicdisplay.load(url).then(
  150. (_: {}) => {
  151. opensheetmusicdisplay.render();
  152. done();
  153. },
  154. done
  155. );
  156. });
  157. it("load something invalid by URL", (done: Mocha.Done) => {
  158. const url: string = "https://www.google.com";
  159. const div: HTMLElement = TestUtils.getDivElement(document);
  160. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  161. opensheetmusicdisplay.load(url).then(
  162. (_: {}) => {
  163. done(new Error("Invalid URL appears to be loaded correctly"));
  164. },
  165. (exc: Error) => {
  166. if (exc.message.toLowerCase().match(/opensheetmusicdisplay.*invalid/)) {
  167. done();
  168. } else {
  169. done(new Error("Unexpected error: " + exc.message));
  170. }
  171. }
  172. );
  173. }).timeout(5000);
  174. it("load invalid URL", (done: Mocha.Done) => {
  175. const url: string = "https://www.afjkhfjkauu2ui3z2uiu.com";
  176. const div: HTMLElement = TestUtils.getDivElement(document);
  177. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  178. opensheetmusicdisplay.load(url).then(
  179. (_: {}) => {
  180. done(new Error("Invalid URL appears to be loaded correctly"));
  181. },
  182. (exc: Error) => {
  183. if (exc.message.toLowerCase().match(/url/)) {
  184. done();
  185. } else {
  186. done(new Error("Unexpected error: " + exc.message));
  187. }
  188. }
  189. );
  190. }).timeout(5000);
  191. it("load invalid XML string", (done: Mocha.Done) => {
  192. const xml: string = "<?xml";
  193. const div: HTMLElement = TestUtils.getDivElement(document);
  194. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  195. opensheetmusicdisplay.load(xml).then(
  196. (_: {}) => {
  197. done(new Error("Corrupted XML appears to be loaded correctly"));
  198. },
  199. (exc: Error) => {
  200. if (exc.message.toLowerCase().match(/partwise/)) {
  201. done();
  202. } else {
  203. done(new Error("Unexpected error: " + exc.message));
  204. }
  205. }
  206. );
  207. });
  208. it("render without loading", (done: Mocha.Done) => {
  209. const div: HTMLElement = TestUtils.getDivElement(document);
  210. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  211. chai.expect(() => {
  212. return opensheetmusicdisplay.render();
  213. }).to.throw(/load/);
  214. done();
  215. });
  216. before((): void => {
  217. // Create the container for the "test width" test
  218. container1 = TestUtils.getDivElement(document);
  219. });
  220. after((): void => {
  221. // Destroy the container for the "test width" test
  222. document.body.removeChild(container1);
  223. });
  224. it("test width 500", (done: Mocha.Done) => {
  225. const div: HTMLElement = container1;
  226. div.style.width = "500px";
  227. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  228. const score: Document = TestUtils.getScore("MuzioClementi_SonatinaOpus36No1_Part1.xml");
  229. opensheetmusicdisplay.load(score).then(
  230. (_: {}) => {
  231. opensheetmusicdisplay.render();
  232. chai.expect(div.offsetWidth).to.equal(500);
  233. done();
  234. },
  235. done
  236. ).catch(done);
  237. });
  238. it("test width 200", (done: Mocha.Done) => {
  239. const div: HTMLElement = container1;
  240. div.style.width = "200px";
  241. const opensheetmusicdisplay: OpenSheetMusicDisplay = TestUtils.createOpenSheetMusicDisplay(div);
  242. const score: Document = TestUtils.getScore("MuzioClementi_SonatinaOpus36No1_Part1.xml");
  243. opensheetmusicdisplay.load(score).then(
  244. (_: {}) => {
  245. opensheetmusicdisplay.render();
  246. chai.expect(div.offsetWidth).to.equal(200);
  247. done();
  248. },
  249. done
  250. ).catch(done);
  251. });
  252. describe("cursor with hidden instrument", () => {
  253. let osmd: OpenSheetMusicDisplay;
  254. beforeEach(() => {
  255. const div: HTMLElement = TestUtils.getDivElement(document);
  256. osmd = TestUtils.createOpenSheetMusicDisplay(div);
  257. const score: Document =
  258. TestUtils.getScore("MuzioClementi_SonatinaOpus36No1_Part1.xml");
  259. return osmd.load(score)
  260. .then(() => {
  261. osmd.render();
  262. });
  263. });
  264. it("should move cursor after instrument is hidden", () => {
  265. osmd.Sheet.Instruments[1].Visible = false;
  266. osmd.render();
  267. osmd.cursors[0].show();
  268. for (let i: number = 0; i < 100; i++) {
  269. osmd.cursors[0].next();
  270. }
  271. // After 100 steps in the visible score, cursor reached 3rd note from 17, a C
  272. chai.expect(osmd.cursors[0].NotesUnderCursor()[0].halfTone).to.equal(60);
  273. });
  274. });
  275. describe("cursor", () => {
  276. let opensheetmusicdisplay: OpenSheetMusicDisplay;
  277. beforeEach((done: Mocha.Done) => {
  278. const div: HTMLElement = container1;
  279. opensheetmusicdisplay = TestUtils.createOpenSheetMusicDisplay(div);
  280. const score: Document = TestUtils.getScore("MuzioClementi_SonatinaOpus36No1_Part1.xml");
  281. opensheetmusicdisplay.load(score).then(
  282. (_: {}) => {
  283. opensheetmusicdisplay.render();
  284. opensheetmusicdisplay.cursors[0].show();
  285. done();
  286. },
  287. done
  288. ).catch(done);
  289. });
  290. describe("get AllVoicesUnderCursor", () => {
  291. it("retrieves all voices under cursor", () => {
  292. const voiceEntries: VoiceEntry[] = opensheetmusicdisplay.cursors[0].VoicesUnderCursor();
  293. chai.expect(voiceEntries.length).to.equal(2);
  294. });
  295. });
  296. describe("VoicesUnderCursor", () => {
  297. it("retrieves voices for a specific instrument under cursor", () => {
  298. const voiceEntries: VoiceEntry[] = opensheetmusicdisplay.cursors[0].VoicesUnderCursor();
  299. chai.expect(voiceEntries.length).to.equal(2);
  300. });
  301. it("retrieves all voices under cursor when instrument not specified", () => {
  302. const instrument: Instrument = opensheetmusicdisplay.Sheet.Instruments[1];
  303. const voiceEntries: VoiceEntry[] = opensheetmusicdisplay.cursors[0].VoicesUnderCursor(instrument);
  304. chai.expect(voiceEntries.length).to.equal(1);
  305. });
  306. });
  307. describe("NotesUnderCursor", () => {
  308. it("gets notes for a specific instrument under cursor", () => {
  309. const instrument: Instrument = opensheetmusicdisplay.Sheet.Instruments[0];
  310. const notes: Note[] = opensheetmusicdisplay.cursors[0].NotesUnderCursor(instrument);
  311. chai.expect(notes.length).to.equal(1);
  312. });
  313. it("gets all notes under cursor when instrument unspecified", () => {
  314. const notes: Note[] = opensheetmusicdisplay.cursors[0].NotesUnderCursor();
  315. chai.expect(notes.length).to.equal(2);
  316. });
  317. });
  318. describe("updateGraphic", () => {
  319. it("updates the graphical sheet with mutations on the music sheet", () => {
  320. const staff: Staff = opensheetmusicdisplay.Sheet.Staves[0];
  321. const voice: Voice = staff.Voices[0];
  322. const voiceEntry: VoiceEntry = voice.VoiceEntries[0];
  323. const numNotesBefore: number = voiceEntry.Notes.length;
  324. // Validate current state
  325. {
  326. const graphicalStaffEntry: GraphicalStaffEntry = opensheetmusicdisplay.GraphicSheet.getStaffEntry(0);
  327. const graphicalNotes: GraphicalNote[] = graphicalStaffEntry.findVoiceEntryGraphicalNotes(voiceEntry);
  328. chai.expect(graphicalNotes.length).to.equal(numNotesBefore);
  329. }
  330. const newNote: Note = new Note(
  331. voiceEntry,
  332. voiceEntry.ParentSourceStaffEntry,
  333. new Fraction(1),
  334. new Pitch(11, 2, AccidentalEnum.NATURAL),
  335. voiceEntry.ParentSourceStaffEntry.VerticalContainerParent.ParentMeasure);
  336. // note: if the pitch is such that the voice entry frequencies aren't ordered correctly,
  337. // Vexflow will complain about unsorted pitches. see below
  338. voiceEntry.Notes.push(newNote);
  339. // we could do something like voiceEntry.sort() here to prevent the Vexflow warning about unsorted pitches,
  340. // but for now sort() only exists on GraphicalVoiceEntry.
  341. opensheetmusicdisplay.updateGraphic();
  342. {
  343. const graphicalStaffEntry: GraphicalStaffEntry = opensheetmusicdisplay.GraphicSheet.getStaffEntry(0);
  344. const graphicalNotes: GraphicalNote[] = graphicalStaffEntry.findVoiceEntryGraphicalNotes(voiceEntry);
  345. chai.expect(graphicalNotes.length).to.equal(numNotesBefore + 1);
  346. }
  347. });
  348. });
  349. });
  350. });