[Bug report]页面闪烁

rainbowatcher commented 2 years ago

✅ Checklist

[X] I am using the latest version

🔎 Description

Concise Description

博客页面内容较少，就是说页面比较短小的情况下，滚动条拉到最下面会出现页面闪烁。

Expected behavior

期待是滚动到底部就停止，页面正常显示。

Steps to reproduce

克隆项目

git clone https://github.com/with-rainbow/theme-gungnir-glimpse.git

启动项目

yarn && yarn docs:dev

访问localhost:8081页面
将页面滚动到底部将看到页面闪烁
Screenshots or Screen Recording (if possible)

📄 Environment info (`npx vuepress info`)

System:
    OS: macOS 12.3.1
    CPU: (8) x64 Intel(R) Core(TM) i7-1068NG7 CPU @ 2.30GHz
    Memory: 128.57 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.14.2 - ~/.nvm/versions/node/v16.14.2/bin/node
    Yarn: 1.22.18 - ~/.yarn/bin/yarn
    npm: 8.7.0 - ~/.nvm/versions/node/v16.14.2/bin/npm
  Utilities:
    Git: 2.32.0 - /usr/bin/git
  Browsers:
    Chrome: 100.0.4896.127
    Edge: Not Found
    Firefox: Not Found
    Safari: 15.4
  npmPackages:
    @vuepress/bundler-vite:  2.0.0-beta.39 
    @vuepress/bundler-webpack: Not Found
    @vuepress/cli:  2.0.0-beta.38 
    @vuepress/client:  2.0.0-beta.38 
    @vuepress/core:  2.0.0-beta.38 
    @vuepress/markdown:  2.0.0-beta.38 
    @vuepress/plugin-active-header-links:  2.0.0-beta.38 
    @vuepress/plugin-back-to-top:  2.0.0-beta.38 
    @vuepress/plugin-container:  2.0.0-beta.38 
    @vuepress/plugin-docsearch: Not Found
    @vuepress/plugin-external-link-icon:  2.0.0-beta.38 
    @vuepress/plugin-git:  2.0.0-beta.38 
    @vuepress/plugin-google-analytics:  2.0.0-beta.38 
    @vuepress/plugin-medium-zoom:  2.0.0-beta.38 
    @vuepress/plugin-nprogress:  2.0.0-beta.38 
    @vuepress/plugin-palette:  2.0.0-beta.38 
    @vuepress/plugin-prismjs:  2.0.0-beta.38 
    @vuepress/plugin-pwa:  2.0.0-beta.38 
    @vuepress/plugin-pwa-popup:  2.0.0-beta.38 
    @vuepress/plugin-register-components: Not Found
    @vuepress/plugin-search: Not Found
    @vuepress/plugin-shiki: Not Found
    @vuepress/plugin-theme-data:  2.0.0-beta.38 
    @vuepress/plugin-toc: Not Found
    @vuepress/shared:  2.0.0-beta.38 
    @vuepress/theme-default:  2.0.0-beta.38 
    @vuepress/utils:  2.0.0-beta.38 
    vue:  3.2.33 
    vue-loader: Not Found
    vue-router:  4.0.14 
    vuepress: ^2.0.0-beta.36 => 2.0.0-beta.39 
    vuepress-vite:  2.0.0-beta.39 
    vuepress-webpack: Not Found

🔗 Reproduction link / repo:

https://github.com/with-rainbow/theme-gungnir-glimpse

Renovamen commented 2 years ago

在 mac 上按照复现步骤试了一下，不知为何在 Chrome 和 Safari 上都没有看到闪烁...具体是怎样的闪烁啊 😂

wutea7 commented 2 years ago

好像是文章太短的话会出现闪烁。

另外我在项目文档“引入图标”下方评论区提了 issue，请求解答一下。

https://user-images.githubusercontent.com/30385457/165433623-b885b238-76f4-43e0-9be9-05b17b1f1e35.mp4

rainbowatcher commented 2 years ago

就像@wutea7 贴出的视频里一样，我在自己电脑上按步骤是可以重现的。推测是页面右侧的toc和右下角的按钮的的问题。在我测试的时候，没有右侧toc出现的时候似乎不会出现闪烁的情况。

Renovamen commented 2 years ago

好的我明白了，文章长度占不满屏幕时就会出现闪烁，之前看不出问题是因为我电脑屏幕太小了。

@wutea7 我已经回复了。

Renovamen commented 2 years ago

在最新版本（2.0.0-alpha.22）中已经修复了这个问题，感谢！

Renovamen / vuepress-theme-gungnir