diff --git a/src/components/GitPanel.tsx b/src/components/GitPanel.tsx index 7a285858b..954add4cb 100644 --- a/src/components/GitPanel.tsx +++ b/src/components/GitPanel.tsx @@ -504,47 +504,56 @@ export class GitPanel extends React.Component { challengerCommit={this.state.challengerCommit} onSelectForCompare={commit => async event => { event.stopPropagation(); - this.setState({ referenceCommit: commit }); + this.setState({ referenceCommit: commit }, () => { + this._openSingleFileComparison( + event as React.MouseEvent + ); + }); }} onCompareWithSelected={commit => async event => { event.stopPropagation(); - this.setState({ challengerCommit: commit }); + this.setState({ challengerCommit: commit }, () => { + this._openSingleFileComparison( + event as React.MouseEvent + ); + }); }} /> - {(this.state.referenceCommit || this.state.challengerCommit) && ( - { - event.stopPropagation(); - this.setState({ - referenceCommit: null, - challengerCommit: null - }); - }} - onOpenDiff={ - this.state.referenceCommit && this.state.challengerCommit - ? openFileDiff(this.props.commands)( - this.state.challengerCommit, - this.state.referenceCommit - ) - : undefined - } - /> - )} + {this.props.model.selectedHistoryFile === null && + (this.state.referenceCommit || this.state.challengerCommit) && ( + { + event.stopPropagation(); + this.setState({ + referenceCommit: null, + challengerCommit: null + }); + }} + onOpenDiff={ + this.state.referenceCommit && this.state.challengerCommit + ? openFileDiff(this.props.commands)( + this.state.challengerCommit, + this.state.referenceCommit + ) + : undefined + } + /> + )} ); } @@ -851,4 +860,25 @@ export class GitPanel extends React.Component { } return
{elem}
; } + + /** + * + */ + private _openSingleFileComparison( + event: React.MouseEvent + ): void { + if ( + this.props.model.selectedHistoryFile && + this.state.referenceCommit && + this.state.challengerCommit + ) { + openFileDiff(this.props.commands)( + this.state.challengerCommit, + this.state.referenceCommit + )( + this.props.model.selectedHistoryFile.to, + !this.props.model.selectedHistoryFile.is_binary + )(event); + } + } } diff --git a/ui-tests/tests/commit-diff.spec.ts b/ui-tests/tests/commit-diff.spec.ts index 4c9087341..ee6124e75 100644 --- a/ui-tests/tests/commit-diff.spec.ts +++ b/ui-tests/tests/commit-diff.spec.ts @@ -16,11 +16,10 @@ test.describe('Commits diff', () => { // URL for merge conflict example repository await page.goto(`tree/${tmpPath}/repository`); - - await page.sidebar.openTab('jp-git-sessions'); }); test('should display commits diff from history', async ({ page }) => { + await page.sidebar.openTab('jp-git-sessions'); await page.click('button:has-text("History")'); const commits = page.locator('li[title="View commit details"]'); @@ -38,4 +37,32 @@ test.describe('Commits diff', () => { expect(await page.waitForSelector('text=Changed')).toBeTruthy(); }); + + test('should display diff from single file history', async ({ page }) => { + await page.sidebar.openTab('filebrowser'); + await page.pause(); + await page.click('#filebrowser >> text=example.ipynb', { + button: 'right' + }); + await page.hover('ul[role="menu"] >> text=Git'); + await page.click('#jp-contextmenu-git >> text=History'); + + await page.waitForSelector('#jp-git-sessions >> ol >> text=example.ipynb'); + + const commits = page.locator('li[title="View file changes"]'); + + expect(await commits.count()).toBeGreaterThanOrEqual(2); + + await commits.last().locator('button[title="Select for compare"]').click(); + await commits + .first() + .locator('button[title="Compare with selected"]') + .click(); + + await expect( + page.locator('.nbdime-Widget >> .jp-git-diff-banner') + ).toHaveText( + /2c87684a46d49989211d666daf05ab92951ba7c4[\n\s]+b6ece342cf6eefaff3232d43345191abda10727/ + ); + }); });