feat: add `CancelToken` and `isCancel` to axios instance #292

3b3ziz · 2019-10-09T07:03:42Z

Providing a solution for #271 by adding CancelToken and isCancel to the exported axios instance.

codecov · 2019-10-09T07:04:30Z

Codecov Report

Merging #292 into dev will not change coverage.
The diff coverage is n/a.

@@         Coverage Diff         @@
##            dev   #292   +/-   ##
===================================
  Coverage   100%   100%           
===================================
  Files         1      1           
  Lines        28     28           
  Branches     13     13           
===================================
  Hits         28     28

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update fdb9837...03a7b20. Read the comment docs.

SaulIO · 2019-10-18T12:27:15Z

Please make this happen.

pi0 · 2019-10-21T13:24:06Z

The plugin (generated) by axios module (@nuxt/axios) is inside .nuxt directory. So at least it is not a solution for #271 (to import from '@nuxtjs/axios'). Making this shortcut could be nice but I appreciate it if you can also add new usage to the docs. (and mentioning why it makes it easier)

Amrmak · 2019-10-21T17:55:59Z

@pi0 would that help ? it's quoted from axios docs

pi0 · 2019-10-22T07:37:33Z

docs/usage.md

+
+```js
+const CancelToken = this.$axios.CancelToken;
+const source = CancelToken.source();


As we just use it once:

Suggested change

const source = CancelToken.source();

const source = thus.$axios.CancelToken.source();

pi0 · 2019-10-22T07:38:11Z

docs/usage.md

+
+this.$axios.$get('/user/12345', {
+  cancelToken: source.token
+}).catch(function (thrown) {


Suggested change

}).catch(function (thrown) {

}).catch((error) => {

pi0 · 2019-10-22T07:38:28Z

docs/usage.md

+  cancelToken: source.token
+}).catch(function (thrown) {
+  if (this.$axios.isCancel(thrown)) {
+    console.log('Request canceled', thrown.message);


Suggested change

console.log('Request canceled', thrown.message);

console.log('Request canceled', error.message);

pi0 · 2019-10-22T07:38:36Z

docs/usage.md

+You can create a cancel token using the `CancelToken.source` factory as shown below:
+
+```js
+const CancelToken = this.$axios.CancelToken;


Suggested change

const CancelToken = this.$axios.CancelToken;

pi0 · 2019-10-22T07:38:59Z

docs/usage.md

+  cancelToken: source.token
+}).catch(function (thrown) {
+  if (this.$axios.isCancel(thrown)) {
+    console.log('Request canceled', thrown.message);


Suggested change

console.log('Request canceled', thrown.message);

console.error('Request canceled:', error);

pi0 · 2019-10-22T07:39:28Z

docs/usage.md

+You can also create a cancel token by passing an executor function to the `CancelToken` constructor:
+
+```js
+const CancelToken = this.$axios.CancelToken;


Suggested change

const CancelToken = this.$axios.CancelToken;

const { CancelToken } = this.$axios;

pi0 · 2019-10-22T07:41:10Z

docs/usage.md

+let cancel;
+
+this.$axios.$get('/user/12345', {
+  cancelToken: new CancelToken(function executor(c) {


Can't we simply instantiate CancelToken outside?

These are the examples in the axios docs.

Personally I'd leave it as is and state that you're quoting rather than treating these doc as part of this project.

OK :) But i would suggest update function to arrow

pi0 · 2019-10-22T07:41:55Z

Thanks @Amrmak . Just left some minor comments.

Amrmak · 2019-10-22T21:36:40Z

Thanks @pi0 for the feedback.
Kindly check the applied comments and if you have further comments.

ricardogobbosouza

@Amrmak minor comments

Please remove all ;

ricardogobbosouza · 2019-10-23T11:00:13Z

docs/usage.md

+You can create a cancel token using the `CancelToken.source` factory as shown below:
+
+```js
+const { CancelToken } = this.$axios;


No need this line

ricardogobbosouza · 2019-10-23T11:03:10Z

docs/usage.md

+    } else {
+      // handle error
+    }
+  });


Formatting:

this.$axios.$get('/user/12345', { cancelToken: source.token }).catch(error => { if (this.$axios.isCancel(error)) { console.log('Request canceled', error) } else { // handle error } })

ricardogobbosouza · 2019-10-23T11:04:41Z

docs/usage.md

+  {
+    cancelToken: source.token,
+  },
+);


Formatting

this.$axios.$post('/user/12345', { name: 'new name' }, { cancelToken: source.token })

SaulIO · 2019-10-23T11:17:26Z

@Amrmak minor comments

Please remove all ;

Please don't. The no- semi-colon movement is going to make it impossible to optimise JITs someday soon.

Python is a whitespace-organised language. JavaScript isn't and it's going to cause trouble trying to make it one.

pi0 · 2019-10-23T11:25:49Z

@SaulIO We are following standardJS with eslint-config and also docs and examples so it is appreciated to keep it consistent. But of course, it is 100% optional.

PS: I promise no perf advantages are there when code is compiled/transpiled :)

SaulIO · 2019-10-23T11:48:55Z

@SaulIO We are following standardJS with eslint-config and also docs and examples so it is appreciated to keep it consistent. But of course, it is 100% optional.

PS: I promise no perf advantages are there when code is compiled/transpiled :)

Sad to see the StandardJS movement adding another victim. :P

As I understand it, ambiguity in syntax makes JITing harder and consistency makes it easier, and global consistencies allow global optimisations: See discussion a here re Dart's choices: dart-lang/sdk#30347 (comment)

But OK, I didn't realise it was project standards, even if I wish you'd gone the other way.

pi0 · 2019-10-23T12:03:36Z

(off-topic) @SaulIO JIT executes the final bundle. No matters how we write original code (with or without semi), webpack, babel and terser transform it to the same output :)

SaulIO · 2019-10-23T12:08:05Z

(off-topic) @SaulIO JIT executes the final bundle. No matters how we write original code (with or without semi), webpack, babel and terser transform it to the same output :)

(continuing off-topic) Right, but shouldn't we have a "run anywhere" standard for portability?

Ie, we'd want it to behave the same in tooled vs untooled environments.

ricardogobbosouza · 2019-10-23T15:42:33Z

docs/usage.md

+this.$axios.$post('/user/12345', {
+    name: 'new name'
+  }, {
+    cancelToken: source.token


Fix indentation

ricardogobbosouza · 2019-10-23T15:43:25Z

lib/plugin.js

@@ -186,6 +186,8 @@ export default (ctx, inject) => {

  // Create new axios instance
  const axios = Axios.create(axiosOptions)
+  axios.CancelToken = Axios.CancelToken;
+  axios.isCancel = Axios.isCancel;


pi0

Awesome work ❤️

pi0 · 2019-10-23T16:32:32Z

https://github.com/nuxt-community/axios-module/releases/tag/v5.8.0

feat: add CancelToken and isCancel to axios instance

0cc9471

This was referenced Oct 21, 2019

Export CancelToken #271

Closed

Add instructions for adding CancelationTokens #297

Closed

docs: add cancelToken usage in docs

74daad4

pi0 reviewed Oct 22, 2019

View reviewed changes

docs: update docs/usage.md

e84f0af

ricardogobbosouza suggested changes Oct 23, 2019

View reviewed changes

docs: update docs/usage.md

80316b7

ricardogobbosouza suggested changes Oct 23, 2019

View reviewed changes

Amr Abdelkader added 2 commits October 23, 2019 18:01

docs: update docs/usage.md

b92860c

style: remove semi-colons

03a7b20

pi0 approved these changes Oct 23, 2019

View reviewed changes

pi0 changed the title ~~feat: add CancelToken and isCancel to axios instance~~ feat: add CancelToken and isCancel to axios instance Oct 23, 2019

pi0 merged commit b9335b1 into nuxt-community:dev Oct 23, 2019

pi0 pushed a commit that referenced this pull request Oct 23, 2019

feat: add CancelToken and isCancel to axios instance (#292)

474910b

snyk-bot mentioned this pull request Feb 27, 2020

[Snyk] Upgrade @nuxtjs/axios from 5.8.0 to 5.9.5 bokismoki/skullcandy#2

Merged

snyk-bot mentioned this pull request Apr 15, 2020

[Snyk] Upgrade @nuxtjs/axios from 5.5.4 to 5.9.5 mc-ireiser/termodaq_app#5

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: add `CancelToken` and `isCancel` to axios instance #292

feat: add `CancelToken` and `isCancel` to axios instance #292

3b3ziz commented Oct 9, 2019

codecov bot commented Oct 9, 2019 •

edited

SaulIO commented Oct 18, 2019

pi0 commented Oct 21, 2019 •

edited

Amrmak commented Oct 21, 2019

pi0 Oct 22, 2019

pi0 Oct 22, 2019

pi0 Oct 22, 2019

pi0 Oct 22, 2019

pi0 Oct 22, 2019

pi0 Oct 22, 2019

pi0 Oct 22, 2019

SaulIO Oct 22, 2019

pi0 Oct 22, 2019 •

edited

pi0 commented Oct 22, 2019

Amrmak commented Oct 22, 2019

ricardogobbosouza left a comment

ricardogobbosouza Oct 23, 2019

ricardogobbosouza Oct 23, 2019

ricardogobbosouza Oct 23, 2019

SaulIO commented Oct 23, 2019 •

edited

pi0 commented Oct 23, 2019

SaulIO commented Oct 23, 2019

pi0 commented Oct 23, 2019 •

edited

SaulIO commented Oct 23, 2019

ricardogobbosouza Oct 23, 2019

ricardogobbosouza Oct 23, 2019

pi0 left a comment

pi0 commented Oct 23, 2019

	const source = CancelToken.source();
	const source = thus.$axios.CancelToken.source();

	console.log('Request canceled', thrown.message);
	console.log('Request canceled', error.message);

	console.log('Request canceled', thrown.message);
	console.error('Request canceled:', error);

	const CancelToken = this.$axios.CancelToken;
	const { CancelToken } = this.$axios;

feat: add CancelToken and isCancel to axios instance #292

feat: add CancelToken and isCancel to axios instance #292

Conversation

3b3ziz commented Oct 9, 2019

codecov bot commented Oct 9, 2019 • edited

Codecov Report

SaulIO commented Oct 18, 2019

pi0 commented Oct 21, 2019 • edited

Amrmak commented Oct 21, 2019

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

pi0 Oct 22, 2019 • edited

Choose a reason for hiding this comment

pi0 commented Oct 22, 2019

Amrmak commented Oct 22, 2019

ricardogobbosouza left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

SaulIO commented Oct 23, 2019 • edited

pi0 commented Oct 23, 2019

SaulIO commented Oct 23, 2019

pi0 commented Oct 23, 2019 • edited

SaulIO commented Oct 23, 2019

Choose a reason for hiding this comment

Choose a reason for hiding this comment

pi0 left a comment

Choose a reason for hiding this comment

pi0 commented Oct 23, 2019

feat: add `CancelToken` and `isCancel` to axios instance #292

feat: add `CancelToken` and `isCancel` to axios instance #292

codecov bot commented Oct 9, 2019 •

edited

pi0 commented Oct 21, 2019 •

edited

pi0 Oct 22, 2019 •

edited

SaulIO commented Oct 23, 2019 •

edited

pi0 commented Oct 23, 2019 •

edited