Skip to content

Commit

Permalink
Don't attempt to hydrate the DOM
Browse files Browse the repository at this point in the history
Currently broken in Vue, due to vuejs/core#5063

Bug: T318137
Change-Id: I8a12a78bf62cccf4e9d900e09d9b49f6f124f893
  • Loading branch information
mariushoch committed Oct 17, 2022
1 parent 7f519e5 commit ba6eb18
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 20 deletions.
2 changes: 1 addition & 1 deletion dist/wikibase.termbox.main.js

Large diffs are not rendered by default.

23 changes: 5 additions & 18 deletions src/client/buildAndAttemptHydration.ts
Original file line number Diff line number Diff line change
Expand Up @@ -34,22 +34,9 @@ export default async function buildAndAttemptHydration(

const app = await buildApp( termboxRequest, services, config );

// mount the app in the wrapper element,
// hiding warnings and errors because we know the DOM won’t hydrate perfectly (T300176)
/* eslint-disable no-console */
app.config.warnHandler = () => undefined;
const consoleError = console.error;
console.error = ( ...args ) => {
if ( args.length === 1 && args[ 0 ] === 'Hydration completed but contains mismatches.' ) {
// ignore, Vue offers no way to hide this hard-coded warning
} else {
return consoleError( ...args );
}
};
try {
app.mount( wrapperElement );
} finally {
console.error = consoleError;
}
/* eslint-enable no-console */
// T318137: Due to https://github.com/vuejs/core/issues/5063 we can't rely on
// Vue's hydration (as of October 2022).
wrapperElement.textContent = '';

app.mount( wrapperElement );
}
4 changes: 3 additions & 1 deletion tests/unit/client/buildAndAttemptHydration.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -72,8 +72,10 @@ describe( 'buildAndAttemptHydration', () => {
const wrapperElement = mockApp.mount.mock.calls[ 0 ][ 0 ] as HTMLElement;
expect( wrapperElement.className ).toBe( 'wikibase-entitytermsview-wrapper' );
expect( wrapperElement.parentElement ).toBe( outerElement );
expect( rootElement.parentElement ).toBe( wrapperElement );
expect( unrelatedElement.parentElement ).toBe( outerElement );
// The root element is discarded, thus has neither a parent nor children
expect( rootElement.parentElement ).toBeNull();
expect( rootElement.childElementCount ).toBe( 0 );
} );
} );

Expand Down

0 comments on commit ba6eb18

Please sign in to comment.