I hereby claim:
- I am silvenon on github.
- I am silvenon (https://keybase.io/silvenon) on keybase.
- I have a public key ASBMkRBQIOMQZD1KKKFsjmxk7FExRR1wmClUd-YvTndoMQo
To claim this, I am signing this object:
I hereby claim:
To claim this, I am signing this object:
I hereby claim:
To claim this, I am signing this object:
This is an example of using Tether Drop with React Portal (and Redux for managing the state). I was asked if using React Portal is redundant, as both libraries pull the content into the <body>
. Using only Drop would cause an invariant violation in React becuase of the DOM mutation, so I'm using React Portal to first bring it outside without React complaining (I don't know how React Portal does it, I haven't checked out the source, but it works). Once it's out of React's supervision, I can apply Drop to it.
Dropdown.jsx
is the actual dropdown componentApp.jsx
is just an demo that uses itThis is my lazy way out of this limitation using an existing library that has much more features than you need, but chances are that you're going to need a library like React Portal anyway for stuff like modals.
import jsdom from 'jsdom'; | |
import assert from 'assert'; | |
describe('suite', () => { | |
let React, utils, Component; | |
before(() => { | |
global.document = jsdom.jsdom('<!DOCTYPE html><html><head></head><body></body></html>'); | |
global.window = document.parentWindow; | |
global.navigator = {userAgent: 'node.js'}; |
var chai = require('chai'); | |
var chaiAsPromised = require('chai-as-promised'); | |
var client = require('webdriverio').remote({ | |
desiredCapabilities: { | |
browserName: 'phantomjs' | |
} | |
}); | |
chai.use(chaiAsPromised); | |
chai.should(); |
These are two forEach
functions; the one I wrote vs. the one I imported from lodash
via Browserify.
(I removed the comments to be more fair.)
// DEBOUNCE FUNCTION via @http://davidwalsh.name/javascript-debounce-function | |
function debounce(a,b,c){var d;return function(){var e=this,f=arguments;clearTimeout(d),d=setTimeout(function(){d=null,c||a.apply(e,f)},b),c&&!d&&a.apply(e,f)}} | |
skrollrCheck = debounce(function() { | |
var winWidth = window.innerWidth; | |
if(winWidth >= 600) { | |
// Init Skrollr | |
skrollr.init({ | |
forceHeight: false,//disable setting height on body | |
mobileDeceleration:0.05, |
/* IE 5-7 */ | |
filter: alpha(opacity=50); | |
/* IE 8 */ | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; | |
/* ಠ_ಠ */ |
-sass: { | |
- files: ['<%= config.app %>/styles/{,*/}*.{scss,sass}'], | |
- tasks: ['sass:server', 'autoprefixer'] | |
-} | |
+compass: { | |
+ files: ['<%= config.app %>/styles/{,*/}*.{scss,sass}'], | |
+ tasks: ['compass:server', 'autoprefixer'] | |
+} | |
... |