diff --git a/.changeset/wise-games-battle.md b/.changeset/wise-games-battle.md new file mode 100644 index 000000000..14e2abe54 --- /dev/null +++ b/.changeset/wise-games-battle.md @@ -0,0 +1,5 @@ +--- +"formik": patch +--- + +Mark `formik` as side-effect free in `package.json` diff --git a/.github/workflows/benchmark.yml b/.github/workflows/benchmark.yml deleted file mode 100644 index 0d3976027..000000000 --- a/.github/workflows/benchmark.yml +++ /dev/null @@ -1,60 +0,0 @@ -name: Performance - -on: - pull_request: - push: - branches: [main] - -jobs: - benchmark: - runs-on: ubuntu-latest - - strategy: - fail-fast: false - matrix: - node: ['18.x'] - - name: Test on node ${{ matrix.node }} - - steps: - - uses: actions/checkout@v3 - - - name: Use Node.js ${{ matrix.node }} - uses: actions/setup-node@v3 - with: - cache: yarn - node-version: ${{ matrix.node }} - - - name: Install & build - run: | - node --version - npm --version - yarn --version - yarn install --frozen-lockfile - yarn build:benchmark - - - name: Download previous benchmark data - uses: actions/cache@v3 - with: - path: ./benchmark-cache - key: ${{ runner.os }}-benchmark - - - name: Run benchmark - run: yarn benchmark - - - name: Store benchmark result - uses: benchmark-action/github-action-benchmark@v1 - with: - tool: benchmarkjs - external-data-json-path: ./benchmark-cache/benchmark-data.json - output-file-path: output.txt - # comment for PRs that's updated with current perf relative to baseline (main) - summary-always: true - # warn if slowness is detected; might be transient on rerun - alert-threshold: 110% - comment-on-alert: true - fail-on-alert: true - # if things get considerably slower, deny the PR - fail-threshold: 120% - # needed for commenting on PRs - github-token: ${{ secrets.GITHUB_TOKEN }} diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml new file mode 100644 index 000000000..9a36bf0fb --- /dev/null +++ b/.github/workflows/ci.yml @@ -0,0 +1,152 @@ +name: ci + +on: + pull_request: + push: + branches: [main] + +jobs: + detectChangedSourceFiles: + name: 'determine changes' + runs-on: ubuntu-latest + outputs: + changes: ${{ steps.changed-files-yaml.outputs.src_any_changed }} + steps: + - uses: actions/checkout@v3 + - name: Detect changed files + id: changed-files-yaml + uses: tj-actions/changed-files@v39 + with: + files_yaml: | + src: + - packages/formik/src/** + - packages/formik/package.json + - packages/formik-native/src/** + - packages/formik-native/package.json + benchmark: + if: needs.detectChangedSourceFiles.outputs.changes == 'true' + runs-on: ubuntu-latest + strategy: + fail-fast: false + steps: + - uses: actions/checkout@v3 + + - uses: actions/setup-node@v3 + with: + cache: yarn + node-version-file: .nvmrc + + - name: Detect changed files + id: changed-files-yaml + uses: tj-actions/changed-files@v39 + with: + files_yaml: | + src: + - packages/formik/src/** + - packages/formik-native/src/** + + - name: Install & build + run: | + node --version + npm --version + yarn --version + yarn install --frozen-lockfile + yarn build:benchmark + + - name: Download previous benchmark data + uses: actions/cache@v3 + with: + path: ./benchmark-cache + key: ${{ runner.os }}-benchmark + + - name: Run benchmark + run: yarn benchmark + + - name: Store benchmark result + uses: benchmark-action/github-action-benchmark@v1 + with: + tool: benchmarkjs + external-data-json-path: ./benchmark-cache/benchmark-data.json + output-file-path: output.txt + # comment for PRs that's updated with current perf relative to baseline (main) + summary-always: true + # warn if slowness is detected; might be transient on rerun + alert-threshold: 110% + comment-on-alert: true + fail-on-alert: true + # if things get considerably slower, deny the PR + fail-threshold: 120% + # needed for commenting on PRs + github-token: ${{ secrets.GITHUB_TOKEN }} + interaction: + if: needs.detectChangedSourceFiles.outputs.changes == 'true' + timeout-minutes: 10 + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - uses: actions/setup-node@v3 + with: + cache: yarn + node-version-file: .nvmrc + + - name: Install dependencies + run: yarn install --frozen-lockfile + + - name: Get installed Playwright version + id: playwright-version + run: echo "PLAYWRIGHT_VERSION=$(node -e "console.log(require('./package-lock.json').dependencies['@playwright/test'].version)")" >> $GITHUB_ENV + + - name: Cache playwright binaries + uses: actions/cache@v3 + id: playwright-cache + with: + path: | + ~/.cache/ms-playwright + key: ${{ runner.os }}-playwright-${{ env.PLAYWRIGHT_VERSION }} + + - name: Install Playwright Browsers + run: yarn playwright install --with-deps + if: steps.playwright-cache.outputs.cache-hit != 'true' + - run: yarn playwright install-deps + if: steps.playwright-cache.outputs.cache-hit != 'true' + + - name: Run Playwright tests + run: yarn playwright test + - uses: actions/upload-artifact@v3 + if: always() + with: + name: playwright-report + path: playwright-report/ + retention-days: 5 + size: + if: needs.detectChangedSourceFiles.outputs.changes == 'true' + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + with: + fetch-depth: 1 + - uses: preactjs/compressed-size-action@v2 + with: + repo-token: '${{ secrets.GITHUB_TOKEN }}' + build-script: 'turbo run build --filter {./packages/*}...' + unit: + if: needs.detectChangedSourceFiles.outputs.changes == 'true' + runs-on: ubuntu-latest + strategy: + fail-fast: false + steps: + - uses: actions/checkout@v3 + - uses: actions/setup-node@v3 + with: + cache: yarn + node-version-file: .nvmrc + - name: Install deps, build, and test + run: | + node --version + npm --version + yarn --version + yarn install --frozen-lockfile + yarn test --coverage + env: + CI: true + NODE_OPTIONS: --max-old-space-size=4096 \ No newline at end of file diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml deleted file mode 100644 index a720fa902..000000000 --- a/.github/workflows/playwright.yml +++ /dev/null @@ -1,45 +0,0 @@ -name: Playwright Tests -on: - push: - branches: [main] - pull_request: -jobs: - test: - timeout-minutes: 10 - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v3 - - uses: actions/setup-node@v3 - with: - cache: yarn - node-version: 18 - - - name: Install dependencies - run: yarn install --frozen-lockfile - - - name: Get installed Playwright version - id: playwright-version - run: echo "PLAYWRIGHT_VERSION=$(node -e "console.log(require('./package-lock.json').dependencies['@playwright/test'].version)")" >> $GITHUB_ENV - - - name: Cache playwright binaries - uses: actions/cache@v3 - id: playwright-cache - with: - path: | - ~/.cache/ms-playwright - key: ${{ runner.os }}-playwright-${{ env.PLAYWRIGHT_VERSION }} - - - name: Install Playwright Browsers - run: yarn playwright install --with-deps - if: steps.playwright-cache.outputs.cache-hit != 'true' - - run: yarn playwright install-deps - if: steps.playwright-cache.outputs.cache-hit != 'true' - - - name: Run Playwright tests - run: yarn playwright test - - uses: actions/upload-artifact@v3 - if: always() - with: - name: playwright-report - path: playwright-report/ - retention-days: 5 diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 3770d5738..83f605fa1 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -16,7 +16,7 @@ jobs: - uses: actions/setup-node@v3 with: cache: yarn - node-version: 18 + node-version-file: .nvmrc - name: Install Dependencies run: yarn install diff --git a/.github/workflows/size.yml b/.github/workflows/size.yml deleted file mode 100644 index 7c515450a..000000000 --- a/.github/workflows/size.yml +++ /dev/null @@ -1,16 +0,0 @@ -name: Compressed Size - -on: [pull_request] - -jobs: - build: - runs-on: ubuntu-latest - - steps: - - uses: actions/checkout@v3 - with: - fetch-depth: 1 - - uses: preactjs/compressed-size-action@v2 - with: - repo-token: '${{ secrets.GITHUB_TOKEN }}' - build-script: 'turbo run build --filter {./packages/*}...' diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml deleted file mode 100644 index 7d06aaaa0..000000000 --- a/.github/workflows/test.yml +++ /dev/null @@ -1,37 +0,0 @@ -name: Unit Test - -on: - pull_request: - push: - branches: [main] - -jobs: - test: - runs-on: ubuntu-latest - - strategy: - fail-fast: false - matrix: - node: ['18.x'] - - name: Test on node ${{ matrix.node }} - - steps: - - uses: actions/checkout@v3 - - - name: Use Node.js ${{ matrix.node }} - uses: actions/setup-node@v3 - with: - cache: yarn - node-version: ${{ matrix.node }} - - - name: Install deps, build, and test - run: | - node --version - npm --version - yarn --version - yarn install --frozen-lockfile - yarn test --coverage - env: - CI: true - NODE_OPTIONS: --max-old-space-size=4096 diff --git a/.nvmrc b/.nvmrc new file mode 100644 index 000000000..3f430af82 --- /dev/null +++ b/.nvmrc @@ -0,0 +1 @@ +v18 diff --git a/docs/api/formik.md b/docs/api/formik.md index 4da6b9ea2..09c0c159b 100644 --- a/docs/api/formik.md +++ b/docs/api/formik.md @@ -216,7 +216,7 @@ Set `touched` imperatively. Calling this will trigger validation to run if `vali If `validateOnBlur` is set to `true` and there are errors, they will be resolved in the returned `Promise`. -#### `setValues: (fields: React.SetStateAction<{ [field: string]: any }>, shouldValidate?: boolean) => void` +#### `setValues: (fields: React.SetStateAction<{ [field: string]: any }>, shouldValidate?: boolean) => Promise>` Set `values` imperatively. Calling this will trigger validation to run if `validateOnChange` is set to `true` (which it is by default). You can also explicitly prevent/skip validation by passing a second argument as `false`. diff --git a/docs/guides/form-submission.md b/docs/guides/form-submission.md index 6c0ea4e2a..fe359488b 100644 --- a/docs/guides/form-submission.md +++ b/docs/guides/form-submission.md @@ -23,8 +23,10 @@ To submit a form in Formik, you need to somehow fire off the provided `handleSub ### Submission -- Proceed with running your submission handler (i.e.`onSubmit` or `handleSubmit`) -- _you call `setSubmitting(false)`_ in your handler to finish the cycle +- Proceed with running the submission handler (i.e. `onSubmit` or `handleSubmit`) +- Did the submit handler return a promise? + - Yes: Wait until it is resolved or rejected, then set `setSubmitting` to `false` + - No: _Call `setSubmitting(false)`_ to finish the cycle ## Frequently Asked Questions @@ -55,3 +57,12 @@ Disable whatever is triggering submission if `isSubmitting` is `true`. If `isValidating` is `true` and `isSubmitting` is `true`. + +
+Why does `isSubmitting` remain true after submission? + +If the submission handler returns a promise, make sure it is correctly resolved or rejected when called. + +If the submission handler does not return a promise, make sure `setSubmitting(false)` is called at the end of the handler. + +
diff --git a/packages/formik/package.json b/packages/formik/package.json index beae82474..9faf9bac3 100644 --- a/packages/formik/package.json +++ b/packages/formik/package.json @@ -37,6 +37,7 @@ "peerDependencies": { "react": ">=16.8.0" }, + "sideEffects": false, "scripts": { "test": "tsdx test --env=jsdom", "test:watch": "npm run test -- --watchAll", diff --git a/website/src/blog/new-docs.md b/website/src/blog/new-docs.md index 9d0be2303..6a2aa8d41 100644 --- a/website/src/blog/new-docs.md +++ b/website/src/blog/new-docs.md @@ -117,7 +117,7 @@ I accidentally discovered the new version of docsearch.js while working on the d ![/images/blog/algolia-docsearch-screenshot.png](/images/blog/algolia-docsearch-screenshot.png) -Overall, I'm pretty happy with the new docs site. For the first time in a while, I'm excited to write docs again. There's still a decent amount of features still missing, but I'm very happy with the end-user experience and the developer experience that this stack provides. Next.js gives us a great foundation for building more app-like features into the docs site. The first of these will be a brand new interactive tutorial as well as a new searchable example and boilerplate directory. As always, if you're if you're interested helping out or diving deeper, the [full source code of the new docs is available on GitHub](https://github.com/formik/formik). +Overall, I'm pretty happy with the new docs site. For the first time in a while, I'm excited to write docs again. There's still a decent amount of features still missing, but I'm very happy with the end-user experience and the developer experience that this stack provides. Next.js gives us a great foundation for building more app-like features into the docs site. The first of these will be a brand new interactive tutorial as well as a new searchable example and boilerplate directory. As always, if you're interested helping out or diving deeper, the [full source code of the new docs is available on GitHub](https://github.com/formik/formik). So with that, go poke around, but be gentle. If you find any bugs, [file an issue.](https://github.com/formik/formik/issues/new?template=Bug_report.md) With this new Notion-powered blog, I'll be posting a lot more often, so enter your email and slap that subscribe button in the footer to join the Formik mailing list.