check in

poying · poying · commit 0fc7238fa034 · 2020-04-20T15:00:57.000+08:00
diff --git a/.babelrc.js b/.babelrc.js
@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    "@babel/preset-env"
+  ]
+}
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,12 @@
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+trim_trailing_whitespace = false
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,8 @@
+.DS_Store
+.vscode
+*.log
+node_modules
+/tmp
+/commonjs
+/module
+./cache
diff --git a/.idea/.gitignore b/.idea/.gitignore
diff --git a/.idea/get-window-scroll-top.iml b/.idea/get-window-scroll-top.iml
diff --git a/.idea/misc.xml b/.idea/misc.xml
diff --git a/.idea/modules.xml b/.idea/modules.xml
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
diff --git a/.npmignore b/.npmignore
@@ -0,0 +1,10 @@
+.idea
+.DS_Store
+.vscode
+*.log
+coverage
+node_modules
+.gitignore
+/.babelrc.js
+/src
+/.cache
diff --git a/.npmrc b/.npmrc
@@ -0,0 +1,2 @@
+loglevel=info
+package-lock=false
diff --git a/README.md b/README.md
@@ -1,2 +1,48 @@
 # get-window-scroll-top
+
 get window's scroll top cross browser
+
+## Install
+
+```
+npm install get-window-scroll-top
+```
+
+
+## Usage
+
+```js
+import getWindowScrollTop from 'get-window-scroll-top'
+
+const scrollTop = getWindowScrollTop()
+// value: 1000
+```
+
+## Why use this module?
+
+To get window's scroll top, you must consider the compatibility of multiple browsers.
+
+Then you have to use `feature detect`, which checks the following scenes:
+
+1. `window.pageYOffset`
+2. `document.body.scrollTop`
+3. `document.documentElement.scrollTop`
+
+and handle the edge cases where some of them are invalid.
+
+One of the common implements is as follows:
+
+```js
+() =>  window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
+```
+
+It seems that it's just one line to get window's scroll top. However, the outcome is obvious:
+
++ Missing edge cases when `window`/`document`/`document.body`/`document.documentElement` is missing, making the code above to throw.
++ Unnecessary conditional checks **`DURING EVER CALL`**. You may find it unnoticeable, but please consider invoking the function in window's `scroll` event listener, it might a waste of cost.
+
+To overcome the above details, we invent this module.
+
+We use feature detect including edge cases, once the code find a way to access the `scrollTop` value properly, future call to the function will `JUST INVOKE THE EXTACT IMPLEMENT` without any unnecessary checks. In this way, we gain the best performance as possible.
+
+The source code might seem a little longer, but after `treeshaking`/`uglify`, it's nothing to worry about, just several bytes increment.
diff --git a/package.json b/package.json
@@ -0,0 +1,35 @@
+{
+  "name": "get-window-scroll-top",
+  "version": "1.0.0",
+  "description": "get window's scroll top cross browser",
+  "main": "commonjs/es5/index.js",
+  "module": "module/es7/index.js",
+  "jsnext:main": "module/es7/index.js",
+  "scripts": {
+    "build": "babel-node src/build/index.js",
+    "prepublish": "npm run build"
+  },
+  "keywords": [
+    "window",
+    "scrolltop",
+    "browser"
+  ],
+  "devDependencies": {
+    "@babel/cli": "^7.1.5",
+    "@babel/core": "^7.1.6",
+    "@babel/node": "^7.0.0",
+    "@babel/preset-env": "^7.1.6",
+    "rollup": "^2.6.1",
+    "rollup-plugin-babel": "^4.0.3"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/xboy2012/get-window-scroll-top.git"
+  },
+  "author": "xboy2012",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/xboy2012/get-window-scroll-top/issues"
+  },
+  "homepage": "https://github.com/xboy2012/get-window-scroll-top#readme"
+}
diff --git a/src/build/build_es5_cjs.js b/src/build/build_es5_cjs.js
@@ -0,0 +1,20 @@
+import { rollup } from 'rollup'
+import babel from 'rollup-plugin-babel'
+import { ROOT_DIR } from '../core/configs'
+import { externals } from '../core/consts'
+
+export default async () => {
+  const bundle = await rollup({
+    input: `${ROOT_DIR}/src/index.js`,
+    external: externals,
+    plugins: [
+      babel(),
+    ],
+  })
+  await bundle.write({
+    file: `${ROOT_DIR}/commonjs/es5/index.js`,
+    format: 'cjs',
+    sourcemap: true,
+    strict: false,
+  })
+}
diff --git a/src/build/build_es5_module.js b/src/build/build_es5_module.js
@@ -0,0 +1,20 @@
+import { rollup } from 'rollup'
+import babel from 'rollup-plugin-babel'
+import { ROOT_DIR } from '../core/configs'
+import { externals } from '../core/consts'
+
+export default async () => {
+  const bundle = await rollup({
+    input: `${ROOT_DIR}/src/index.js`,
+    external: externals,
+    plugins: [
+      babel(),
+    ],
+  })
+  await bundle.write({
+    file: `${ROOT_DIR}/module/es5/index.js`,
+    format: 'es',
+    sourcemap: true,
+    strict: false,
+  })
+}
diff --git a/src/build/build_es7_cjs.js b/src/build/build_es7_cjs.js
@@ -0,0 +1,16 @@
+import { rollup } from 'rollup'
+import { ROOT_DIR } from '../core/configs'
+import { externals } from '../core/consts'
+
+export default async () => {
+  const bundle = await rollup({
+    input: `${ROOT_DIR}/src/index.js`,
+    external: externals,
+  })
+  await bundle.write({
+    file: `${ROOT_DIR}/commonjs/es7/index.js`,
+    format: 'cjs',
+    sourcemap: true,
+    strict: false,
+  })
+}
diff --git a/src/build/build_es7_module.js b/src/build/build_es7_module.js
@@ -0,0 +1,16 @@
+import { rollup } from 'rollup'
+import { ROOT_DIR } from '../core/configs'
+import { externals } from '../core/consts'
+
+export default async () => {
+  const bundle = await rollup({
+    input: `${ROOT_DIR}/src/index.js`,
+    external: externals,
+  })
+  await bundle.write({
+    file: `${ROOT_DIR}/module/es7/index.js`,
+    format: 'es',
+    sourcemap: true,
+    strict: false,
+  })
+}
diff --git a/src/build/index.js b/src/build/index.js
@@ -0,0 +1,15 @@
+import buildES7CJS from './build_es7_cjs';
+import buildES5CJS from './build_es5_cjs';
+import buildES7Module from './build_es7_module';
+import buildES5Module from './build_es5_module';
+
+const run = async () => {
+  await Promise.all([
+    buildES7CJS(),
+    buildES5CJS(),
+    buildES7Module(),
+    buildES5Module()
+  ]);
+};
+
+run();
diff --git a/src/core/configs.js b/src/core/configs.js
@@ -0,0 +1,3 @@
+import path from 'path'
+
+export const ROOT_DIR = path.resolve(__dirname, '../..')
diff --git a/src/core/consts.js b/src/core/consts.js
@@ -0,0 +1,2 @@
+// 所有外部依赖的lib
+export const externals = []
diff --git a/src/index.js b/src/index.js
@@ -0,0 +1,54 @@
+function getPageYOffset() {
+  return window.pageYOffset;
+}
+
+function getBodyScrollTop () {
+  return document.body.scrollTop;
+}
+
+function getDocumentElementScrollTop() {
+  return document.documentElement.scrollTop;
+}
+
+function getScrollTopAuto() {
+  if (typeof window === 'undefined') {
+    return 0;
+  }
+  const pageYOffset = getPageYOffset();
+  if (pageYOffset) {
+    // window.pageYOffset has a proper value,
+    // thus future invoke use getPageYOffset();
+    _getScrollTop = getPageYOffset;
+    return pageYOffset;
+  }
+  if (typeof document === 'undefined') {
+    return 0;
+  }
+  if (document.body) {
+    const bodyScrollTop = getBodyScrollTop();
+    if (bodyScrollTop) {
+      // document.body.scrollTop has a proper value,
+      // thus future invoke use getBodyScrollTop();
+      _getScrollTop = getBodyScrollTop;
+      return bodyScrollTop;
+    }
+  }
+  if (document.documentElement) {
+    const documentElementScrollTop = getDocumentElementScrollTop();
+    if (documentElementScrollTop) {
+      // document.documentElement.scrollTop has a proper value,
+      // thus future invoke use getDocumentElementScrollTop();
+      _getScrollTop = getDocumentElementScrollTop;
+      return documentElementScrollTop;
+    }
+  }
+  return 0;
+}
+
+let _getScrollTop = getScrollTopAuto;
+
+const getScrollTop = () => {
+  return _getScrollTop();
+}
+
+export default getScrollTop;

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+loglevel=info`
	`2`	`+package-lock=false`