Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enable server-side/isomorphic rendering #360

Merged
merged 11 commits into from
Dec 13, 2016
Merged

Enable server-side/isomorphic rendering #360

merged 11 commits into from
Dec 13, 2016

Conversation

codebling
Copy link
Contributor

Fixes #131

Checklist

  • Tests run successfully. No test updates needed.
  • No documentation changes necessary.

Changes proposed in this pull request:

  • Resolves a few minor issues which prevent Blueprint from rendering on the server.

…default to null to fix server-side rendering.
… default to "ctrl" (as on all non-Apple platforms) to fix server-side rendering.
…ber before attempting to use it. Fixes server-side rendering.
…endering, since 'componentDidMount' never gets called on the server ('componentWillMount' does).
…ger more useable by not exploding when it called during the server lifecycle.
@palantirtech
Copy link
Member

Thanks for your interest in palantir/blueprint, @codebling! Before we can accept your pull request, you need to sign our contributor license agreement - just visit https://cla.palantir.com/ and follow the instructions. Once you sign, I'll automatically update this pull request.

This was referenced Dec 13, 2016
@codebling
Copy link
Contributor Author

I've enabled CircleCI, but I can't for the life of me get it to build the right branch.

@codebling
Copy link
Contributor Author

Got CircleCI to work. Linting currently fails. I thought linting was performed in the test task. Fixing now.

}
};

// tslint:disable no-invalid-this only-arrow-functions
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

you don't need this line; L41 disables these rules for the rest of the file until a tslint:enable is encountered.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, good catch. That was a quick copy/paste and I'm not super familiar with TSLint.

@@ -13,7 +13,7 @@ import { comboMatches, getKeyCombo, IKeyCombo, parseKeyCombo } from "./hotkeyPar
import { IHotkeysProps } from "./hotkeys";
import { isHotkeysDialogShowing, showHotkeysDialog } from "./hotkeysDialog";

const SHOW_DIALOG_KEY_COMBO = parseKeyCombo("?");
const SHOW_DIALOG_KEY = "?";
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

};
const focusEngine = typeof document !== "undefined"
? new InteractionModeEngine(document.documentElement, FOCUS_DISABLED_CLASS)
: fakeFocusEngine;

// this is basically meaningless to unit test; it requires manual UI testing
/* istanbul ignore next */
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unit test coverage is failing for this file; it's pretty hard to cover this functionality anyway, so we should disable the whole file. I suggest moving this /* istanbul ignore next */ line to the top, right after the license.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sounds good, thanks. I was just struggling with that. Coverage inexplicably runs on CircleCI but not locally, and I can't figure out why.

Copy link
Contributor

@adidahiya adidahiya Dec 13, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Have you tried gulp karma-unit-core gulp karma-core?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've been using gulp test, which is an alias for gulp karma. gulp karma-core seems to do the same thing but only for the 'core' package. In all cases a coverage report is generated, but it is empty (shows 100% Statements 0/0 100% Branches 0/0 100% Functions 0/0 100% Lines 0/0). Anyhow, coverage seems to pass now.

…o trivial as to render extended testing useless.
@@ -4,12 +4,20 @@
* of the license at https://github.com/palantir/blueprint/blob/master/LICENSE
* and https://github.com/palantir/blueprint/blob/master/PATENTS
*/
/* istanbul ignore next */
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry, maybe it needs to be the first line of the file, before the license? I haven't tried this locally yet.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How does one try it locally? I can't find a task, and coverage doesn't run on gulp test for me the way it does on CircleCI

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'll look it up. ignore next seems to be used on an object-basis elsewhere in the package.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Try gulp karma-core

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@@ -5,7 +5,12 @@
* and https://github.com/palantir/blueprint/blob/master/PATENTS
*/

import "dom4";
declare function require(moduleName: string): any; // declare node.js "require" so that we can conditionally import
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

note for a follow-up change (doesn't have to be in this PR): we should share this ambient declaration with https://github.com/palantir/blueprint/blob/497a03eab4420e48db0865407995895aa25726fa/packages/docs/src/require-shim.d.ts

Copy link
Contributor Author

@codebling codebling Dec 13, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I included it there in the same file specifically because I was worried about scoping. It makes sense to merge them. Personally, I find the Node.js form clearer than the one used in require-shim, but whatever works!

@adidahiya
Copy link
Contributor

adidahiya commented Dec 13, 2016

I checked out this branch and did some regression testing. This looks good to merge. Thanks @codebling!

@adidahiya adidahiya merged commit 7596b0a into palantir:master Dec 13, 2016
@@ -112,7 +112,7 @@ export const Aliases = {
command: "meta",
escape: "esc",
minus: "-",
mod: /Mac|iPod|iPhone|iPad/.test(navigator.platform) ? "meta" : "ctrl",
mod: ((typeof navigator !== "undefined") && /Mac|iPod|iPhone|iPad/.test(navigator.platform)) ? "meta" : "ctrl",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

feels like we should have an isUndefined utility next to isFunction

right = document.documentElement.clientWidth - right;
if (typeof document !== "undefined"
&& typeof document.documentElement !== "undefined"
&& Number(document.documentElement.clientWidth)) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

implicit coercion number => boolean

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Agreed. I spotted this, but unfortunately we can't test for NaN because NaN == NaN is never true. Number.isNaN() would be perfect, but only works if you're targeting es6. Otherwise, NaN correctly coerces to false, and the only other problematic value (coerces to a value we don't want) is 0, but if the clientWidth is 0 then it doesn't matter what the alignment is. So I left as-is. Only other option would be check if it's defined.

Copy link
Contributor

@giladgray giladgray left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

wow that was easy! thank you @codebling 🎩 !

@llorca
Copy link
Contributor

llorca commented Dec 13, 2016

🔥 PR! Nice work @codebling

@codebling
Copy link
Contributor Author

Looks like @giladgray has already updated the wiki. Perfect!

@RobAWilkinson
Copy link

Can we get a release for this?
Npm installs can't point to a git subdirectory where core is

@adidahiya
Copy link
Contributor

@RobAWilkinson coming momentarily: #379

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants