Skip to content

Commit

Permalink
Add simple events test
Browse files Browse the repository at this point in the history
  • Loading branch information
jaredjj3 committed Jun 23, 2024
1 parent 9b56a63 commit b648f0b
Show file tree
Hide file tree
Showing 3 changed files with 318 additions and 0 deletions.
5 changes: 5 additions & 0 deletions src/rendering/rendering.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,11 @@ export class Rendering {
this.root = opts.root;
}

/** Dispatches an event to the interactive surface element. */
dispatchEvent(event: Event): void {
this.root.getOverlayElement().dispatchEvent(event);
}

/** Returns the element that vexflow is directly rendered on. */
getVexflowElement(): SVGElement | HTMLCanvasElement {
return this.root.getVexflowElement();
Expand Down
278 changes: 278 additions & 0 deletions tests/integration/__data__/vexml/events.musicxml
Original file line number Diff line number Diff line change
@@ -0,0 +1,278 @@
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE score-partwise PUBLIC '-//Recordare//DTD MusicXML 2.0 Partwise//EN' 'http://www.musicxml.org/dtds/2.0/partwise.dtd'>
<score-partwise version="2.0">
<defaults>
<scaling>
<millimeters>6.4</millimeters>
<tenths>40</tenths>
</scaling>
<page-layout>
<page-height>1850</page-height>
<page-width>1310</page-width>
</page-layout>
</defaults>
<part-list>
<score-part id="P1">
<part-name>Steel Guitar</part-name>
<part-abbreviation>s.guit.</part-abbreviation>
<midi-instrument id="P1">
<midi-channel>1</midi-channel>
<midi-bank>1</midi-bank>
<midi-program>26</midi-program>
<volume>80</volume>
<pan>0</pan>
</midi-instrument>
</score-part>
</part-list>
<part id="P1">
<measure number="1">
<print new-system="yes"/>
<attributes>
<divisions>8</divisions>
<key>
<fifths>0</fifths>
<mode>major</mode>
</key>
<time>
<beats>4</beats>
<beat-type>4</beat-type>
</time>
<staves>2</staves>
<clef number="1">
<sign>G</sign>
<line>2</line>
</clef>
<clef number="2">
<sign>TAB</sign>
<line>5</line>
</clef>
<staff-details number="1">
<?GP
<root>
<staff-tuning line="1">
<tuning-step>E</tuning-step>
<tuning-octave>2</tuning-octave>
</staff-tuning>
<staff-tuning line="2">
<tuning-step>A</tuning-step>
<tuning-octave>2</tuning-octave>
</staff-tuning>
<staff-tuning line="3">
<tuning-step>D</tuning-step>
<tuning-octave>3</tuning-octave>
</staff-tuning>
<staff-tuning line="4">
<tuning-step>G</tuning-step>
<tuning-octave>3</tuning-octave>
</staff-tuning>
<staff-tuning line="5">
<tuning-step>B</tuning-step>
<tuning-octave>3</tuning-octave>
</staff-tuning>
<staff-tuning line="6">
<tuning-step>E</tuning-step>
<tuning-octave>4</tuning-octave>
</staff-tuning>
</root>
?>
</staff-details>
<staff-details number="2">
<staff-lines>6</staff-lines>
<staff-tuning line="1">
<tuning-step>E</tuning-step>
<tuning-octave>2</tuning-octave>
</staff-tuning>
<staff-tuning line="2">
<tuning-step>A</tuning-step>
<tuning-octave>2</tuning-octave>
</staff-tuning>
<staff-tuning line="3">
<tuning-step>D</tuning-step>
<tuning-octave>3</tuning-octave>
</staff-tuning>
<staff-tuning line="4">
<tuning-step>G</tuning-step>
<tuning-octave>3</tuning-octave>
</staff-tuning>
<staff-tuning line="5">
<tuning-step>B</tuning-step>
<tuning-octave>3</tuning-octave>
</staff-tuning>
<staff-tuning line="6">
<tuning-step>E</tuning-step>
<tuning-octave>4</tuning-octave>
</staff-tuning>
</staff-details>
<transpose number="1">
<diatonic>0</diatonic>
<chromatic>0</chromatic>
<octave-change>-1</octave-change>
</transpose>
</attributes>
<note>
<pitch>
<step>F</step>
<octave>5</octave>
</pitch>
<duration>8</duration>
<voice>1</voice>
<type>quarter</type>
<stem>down</stem>
<notehead>normal</notehead>
<staff>1</staff>
</note>
<note>
<pitch>
<step>F</step>
<octave>5</octave>
</pitch>
<duration>7</duration>
<voice>1</voice>
<type>quarter</type>
<stem>down</stem>
<notehead>normal</notehead>
<staff>1</staff>
</note>
<note>
<chord/>
<pitch>
<step>C</step>
<octave>5</octave>
</pitch>
<duration>7</duration>
<voice>1</voice>
<type>quarter</type>
<stem>down</stem>
<notehead>normal</notehead>
<staff>1</staff>
</note>
<note>
<grace slash="yes"/>
<pitch>
<step>F</step>
<octave>5</octave>
</pitch>
<voice>1</voice>
<type>32nd</type>
<stem>up</stem>
<notehead>normal</notehead>
<staff>1</staff>
</note>
<note>
<pitch>
<step>F</step>
<octave>5</octave>
</pitch>
<duration>8</duration>
<voice>1</voice>
<type>quarter</type>
<stem>down</stem>
<notehead>normal</notehead>
<staff>1</staff>
</note>
<note>
<rest/>
<duration>8</duration>
<voice>1</voice>
<type>quarter</type>
<staff>1</staff>
</note>
<backup>
<duration>31</duration>
</backup>
<note>
<pitch>
<step>F</step>
<octave>4</octave>
</pitch>
<duration>8</duration>
<voice>5</voice>
<type>quarter</type>
<stem>down</stem>
<staff>2</staff>
<notations>
<technical>
<string>1</string>
<fret>1</fret>
</technical>
</notations>
</note>
<note>
<pitch>
<step>F</step>
<octave>4</octave>
</pitch>
<duration>7</duration>
<voice>5</voice>
<type>quarter</type>
<stem>down</stem>
<staff>2</staff>
<notations>
<technical>
<string>1</string>
<fret>1</fret>
</technical>
</notations>
</note>
<note>
<chord/>
<pitch>
<step>C</step>
<octave>4</octave>
</pitch>
<duration>7</duration>
<voice>5</voice>
<type>quarter</type>
<stem>down</stem>
<staff>2</staff>
<notations>
<technical>
<string>2</string>
<fret>1</fret>
</technical>
</notations>
</note>
<note>
<grace slash="yes"/>
<pitch>
<step>F</step>
<octave>4</octave>
</pitch>
<voice>5</voice>
<type>32nd</type>
<stem>up</stem>
<staff>2</staff>
<notations>
<technical>
<string>1</string>
<fret>1</fret>
</technical>
</notations>
</note>
<note>
<pitch>
<step>F</step>
<octave>4</octave>
</pitch>
<duration>8</duration>
<voice>5</voice>
<type>quarter</type>
<stem>down</stem>
<staff>2</staff>
<notations>
<technical>
<string>1</string>
<fret>1</fret>
</technical>
</notations>
</note>
<note>
<rest/>
<duration>8</duration>
<voice>5</voice>
<type>quarter</type>
<staff>2</staff>
</note>
</measure>
</part>
</score-partwise>
35 changes: 35 additions & 0 deletions tests/integration/events.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import { Rendering, Vexml } from '@/index';
import * as path from 'path';
import * as fs from 'fs';

const MUSICXML_PATH = path.join(__dirname, '__data__', 'vexml', 'events.musicxml');

describe('events', () => {
let musicXML = '';
const div = document.createElement('div');
let rendering: Rendering;

beforeAll(() => {
musicXML = fs.readFileSync(MUSICXML_PATH, 'utf-8');
});

beforeEach(() => {
rendering = Vexml.fromMusicXML(musicXML).render({ element: div, width: 400 });
jest.useFakeTimers();
});

afterEach(() => {
rendering.destroy();
jest.useRealTimers();
});

it('emits click events', async () => {
const click = jest.fn();

rendering.addEventListener('click', click);
rendering.dispatchEvent(new MouseEvent('mousedown', { bubbles: false }));
rendering.dispatchEvent(new MouseEvent('mouseup', { bubbles: false }));

expect(click).toHaveBeenCalled();
});
});

0 comments on commit b648f0b

Please sign in to comment.