There have been updates to the react monorepo:

• • The devDependency react was updated from 16.10.1 to 16.10.2.

• The devDependency react-dom was updated from 16.10.1 to 16.10.2.
• The devDependency react-test-renderer was updated from 16.10.1 to 16.10.2.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the react group definition.

react is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

I’m getting the following error:

Uncaught (in promise) TypeError: Failed to execute 'observe' on 'IntersectionObserver': parameter 1 is not of type 'Element'.
    at Visible.startObserving (index.js?767f:81)
    at Visible.componentDidMount (index.js?767f:120)
    at eval (ReactCompositeComponent.js?063f:262)
    at measureLifeCyclePerf (ReactCompositeComponent.js?063f:73)
    at eval (ReactCompositeComponent.js?063f:261)
    at CallbackQueue.notifyAll (CallbackQueue.js?7abf:74)
    at ReactReconcileTransaction.close (ReactReconcileTransaction.js?2d36:78)
    at ReactReconcileTransaction.closeAll (Transaction.js?91bc:207)
    at ReactReconcileTransaction.perform (Transaction.js?91bc:154)
    at ReactUpdatesFlushTransaction.perform (Transaction.js?91bc:141)

My code thus far:

/*
 * HomePage
 */

import React from 'react';
import styles from './styles.css';
import IntersectionVisible from 'react-intersection-visible';

import Column from './Column';
import { columns } from './columns';

export class HomePage extends React.Component {
	onIntersect(entries) {
		console.log('Hidden or Visible');
	}

	onHide(entries) {
		console.log('Hidden');
	}

	onShow(entries) {
		console.log('Visible');
	}

	render() {
		const { isReady } = this.state;

		return (
			<div className={ styles.base }>
				<section>
					{ columns.map((column, index) => {
						const sections = column.sections;
						const featured = column.featured;
						const columnData = {
							column,
							isReady,
							sections,
							featured,
							index
						};

						return (
							<IntersectionVisible
								key={ `Section_${index}` }
								onIntersect={ this.onIntersect }
								onHide={ this.onHide }
								onShow={ this.onShow }
							>
								<Column { ...columnData } key={ `Column_${index}` } logLoadedSVG={ this.logLoadedSVG } />
							</IntersectionVisible>
						);
					})}
				</section>
			</div>
		);
	}
}

export default HomePage;

Any ideas?

There have been updates to the enzyme monorepo:

• • The devDependency enzyme was updated from 3.9.0 to 3.10.0.

• The devDependency enzyme-adapter-react-16 was updated from 1.14.0 to 1.15.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the enzyme group definition.

enzyme is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

What do you think about including a polyfill?

https://github.com/WICG/IntersectionObserver/tree/gh-pages/polyfill

The devDependency eslint-plugin-react was updated from 7.16.0 to 7.17.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

eslint-plugin-react is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

The devDependency eslint-plugin-import was updated from 2.17.2 to 2.17.3.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

eslint-plugin-import is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

There have been updates to the enzyme monorepo:

• • The devDependency enzyme was updated from 3.9.0 to 3.10.0.

• The devDependency enzyme-adapter-react-16 was updated from 1.15.0 to 1.15.1.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the enzyme group definition.

enzyme is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

You have a slight error in your docs. There is an extra greater than sign after the onHide prop.

<IntersectionVisible onIntersect={ e => this.onIntersect( e ) }
                                    onHide={ e => this.onHide( e ) }>
                                     onShow={ e => this.onShow( e ) }> 

Thanks for sharing this package, I have found it very useful for my current project!

There have been updates to the react monorepo:

• • The devDependency react was updated from 16.6.1 to 16.6.2.

• The devDependency react-dom was updated from 16.6.1 to 16.6.2.
• The devDependency react-test-renderer was updated from 16.6.1 to 16.6.2.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the react group definition.

react is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

The devDependency eslint was updated from 5.15.3 to 5.16.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

eslint is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

I am using the rootMargin option as such:

 <IntersectionVisible onHide={() => this.onHide()} onShow={() => this.onShow()} options={{ rootMargin: '-100px 0px 0px 0px' }}>

But I am receiving an error in the browser console:

Warning: Failed prop type: Invalid prop `options.rootMargin` of type `string` supplied to `IntersectionVisible`, expected `number`.

Unless I'm misreading, it seems that string is the expected type by the IntersectionObserver API. For kicks, I used a number and received the following error:

Uncaught DOMException: Failed to construct 'IntersectionObserver': rootMargin must be specified in pixels or percent.

Manual import 'intersection-observer'; is needed now. However, the readme still states that the polyfill fallback is in place.

Removing the polyfill is a breaking change. I suggest re-adding it for 2.10.1 and removing it in 3.0.0

This way the breaking change is not installed automatically.

There have been updates to the enzyme monorepo:

• • The devDependency enzyme was updated from 3.8.0 to 3.9.0.

• The devDependency enzyme-adapter-react-16 was updated from 1.12.0 to 1.12.1.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the enzyme group definition.

enzyme is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

Thanks for this component at first!
import 'intersection-observer';
breaks down SSR due it uses window object without checking for available inside of it.
Please, can you remove this import and warn this in Readme instead?
Checked at Gatsby 2 at build command.
Thanks!

The devDependency babel-loader was updated from 8.0.2 to 8.0.3.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

babel-loader is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

The devDependency codecov was updated from 3.6.2 to 3.6.3.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

codecov is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴