Skip to content

Fix React 19 compatibility issues with @floating-ui/react #4831

Fix React 19 compatibility issues with @floating-ui/react

Fix React 19 compatibility issues with @floating-ui/react #4831

name: "Test build docs site"
on:
push:
branches: [main]
pull_request:
# The branches below must be a subset of the branches above
branches: [main]
jobs:
update:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Set Node.js
uses: actions/setup-node@v4
with:
node-version: 22.x
- name: Corepack enable
run: corepack enable
- name: Yarn setup
run: corepack prepare --activate
- name: Get yarn cache directory path
id: yarn-cache-dir-path
run: echo "::set-output name=dir::$(yarn config get cacheFolder)"
- uses: actions/cache@v4
id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
with:
path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
restore-keys: |
${{ runner.os }}-yarn-
- name: Install dependencies
run: yarn install
- name: Install docs dependencies
run: yarn --cwd docs-site install
- name: Lint docs
run: yarn --cwd docs-site lint
- name: Build datepicker
run: yarn build
- name: Build docs
run: yarn --cwd docs-site build
- name: Install Playwright
run: |
npm install playwright
npx playwright install --with-deps chromium
- name: Start docs preview server
run: yarn --cwd docs-site preview --host 0.0.0.0 --port 4173 &
- name: Wait for server to be ready
run: |
timeout 30 bash -c 'until curl -s http://localhost:4173 > /dev/null; do sleep 1; done'
- name: Test docs site with Playwright
run: |
cat > test-docs.js << 'EOF'
const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch();
const page = await browser.newPage();
try {
console.log('🚀 Navigating to docs site...');
await page.goto('http://localhost:4173', { waitUntil: 'networkidle' });
console.log('🔍 Looking for "React Datepicker" text...');
await page.waitForSelector('text=React Datepicker', { timeout: 10000 });
// Additional checks
const title = await page.title();
console.log(`✅ Page title: ${title}`);
const hasText = await page.getByText('React Datepicker').isVisible();
if (hasText) {
console.log('✅ Success: "React Datepicker" text is visible on the docs site');
} else {
throw new Error('❌ "React Datepicker" text not found');
}
} catch (error) {
console.error('❌ Test failed:', error.message);
// Take screenshot for debugging
await page.screenshot({ path: 'docs-test-failure.png', fullPage: true });
console.log('📸 Screenshot saved as docs-test-failure.png');
// Log page content for debugging
const content = await page.content();
console.log('🔍 Page content preview:');
console.log(content.substring(0, 1000));
process.exit(1);
} finally {
await browser.close();
}
})();
EOF
node test-docs.js
- name: Upload screenshot on failure
if: failure()
uses: actions/upload-artifact@v4
with:
name: docs-test-screenshot
path: docs-test-failure.png