fix: hide zoom level option in piano roll window's sheet music view

This commit is contained in:
Xiaohan-Tian
2026-05-17 13:09:34 -07:00
parent 9c197ecd08
commit b5f5e1628e
2 changed files with 37 additions and 22 deletions
@@ -130,10 +130,23 @@ describe('PianoRollToolbar', () => {
expect(screen.getByRole('button', { name: 'Sheet Music View' })).toBeInTheDocument(); expect(screen.getByRole('button', { name: 'Sheet Music View' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /16,48/i })).toBeInTheDocument(); expect(screen.getByRole('button', { name: /16,48/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: 'Show Entire Track' })).toBeInTheDocument(); expect(screen.getByRole('button', { name: 'Show Entire Track' })).toBeInTheDocument();
expect(screen.queryByRole('button', { name: '1x' })).not.toBeInTheDocument();
expect(screen.queryByRole('button', { name: 'Pointer Tool' })).not.toBeInTheDocument(); expect(screen.queryByRole('button', { name: 'Pointer Tool' })).not.toBeInTheDocument();
expect(screen.queryByRole('button', { name: /Pitch Bend/i })).not.toBeInTheDocument(); expect(screen.queryByRole('button', { name: /Pitch Bend/i })).not.toBeInTheDocument();
}); });
it('shows the zoom button outside sheet mode', () => {
render(
<PianoRollToolbar
{...baseProps}
sheetMusicViewEnabled={false}
mode="midi-edit"
/>
);
expect(screen.getByRole('button', { name: '1x' })).toBeInTheDocument();
});
it('toggles the full-track sheet scope button', () => { it('toggles the full-track sheet scope button', () => {
const onSheetMusicTrackScopeToggle = vi.fn(); const onSheetMusicTrackScopeToggle = vi.fn();
@@ -256,6 +256,7 @@ const PianoRollToolbar: React.FC<PianoRollToolbarProps> = ({
</div> </div>
)} )}
{!sheetMusicViewEnabled && (
<div className="quant-dropdown-container" ref={zoomSliderRef}> <div className="quant-dropdown-container" ref={zoomSliderRef}>
<button <button
className="quant-button" className="quant-button"
@@ -278,6 +279,7 @@ const PianoRollToolbar: React.FC<PianoRollToolbarProps> = ({
</div> </div>
)} )}
</div> </div>
)}
</div> </div>
</div> </div>
); );