Order of plugin extends breaks plugin functions

[Worly]

Describe the bug
I'm trying to use two plugins (duration and objectSupport) in my Angular app. While using datejs#add function with argument of type Duration (implemented in duration plugin), I get Invalid Date if the plugin objectSupport is extended after the duration plugin. If objectSupport is extended before the duration plugin then add method works fine.

Demo
CodeSandbox link https://codesandbox.io/s/festive-sutherland-thxuux?file=/src/app/app.module.ts
In app.module.ts, change the order of lines 10 and 11, and look at console after refreshing Browser preview tab.

Expected behavior
No matter the order of plugin extends, all plugin functions should work as expected.

Information

• Day.js Version ^1.11.5
• OS: Windows 10
• Browser Chrome/103.0.5060.134

[BePo65]

As a basic pattern, plugins create a chain of function calls for overwritten / extended functions (like parse or add).
Therefore the sequence of extending dayjs is important (and should be documented in the documentation site).

Some plugins depend on other plugins. In that case this is part of the documentation and means that the dependant plugin must be extend-ed after the prerequisite plugin.

duration and objectSupport are a special case: the problem is that a Duration object is instanceof Duration and of course also instanceof Object and that information is used e.g. in parsing. So the duration plugin must be extend-ded after the objectSupport plugin and that information is missing in the documentation.

Perhaps you want to create a PR in the docu repo?

[iamkun]

Maybe we can update the logic something like this

class Duration {
  constructor() {
    this.isDurationObj = true 
  }
}
// then
argument instanceof Object && !argument.isDurationObj

to fix this issue?

---

btw, @BePo65 , do you mind taking a look at a minor update in the comments in #1914 so that we can get it merged?

[BePo65]

I am afraid that this will not work, as the class Duration is not known in the objectSupport plugin (or anywhere outside of the duration plugin).

We could add something like this to the start of the initialization of the objectSupport plugin:

  if (dayjs.duration !== 'undefined') {
    console.error('the plugin objectSupport should be extended before the plugin Duration')
  }

but IMHO two plugins should not directly reference each other. And wouldn't we have also do this for plugins that depend on other plugins?

Although nobody reads the documentation 😄 I would simply update the documentation (where this consequence is not documented until today).

BTW: there a few pr for the documentation website that are perhaps worth a little bit of your time - shouldn't be too much work to review them 😃

[iamkun]

It could be possible.

cause in ObjectSupport plugin, it will check if the argument is an object, argument instanceof Object

all we have to do, is to add a property to the passed object in Duration plugin so that the logic !argument.isDurationObj will know if it is a duration object.

[BePo65]

Of course it would be possible, but IMO objectSupport should not know anything about other plugins it does not depend on.

I think I found a solution that does respect this requirement.
If we use obj.constructor.name === 'Object' instead of obj instanceof Object we can differentiate between plain objects and objects that are instances of a class. And as 'Object' is a native type, it will not get a new name, when the code is minified which would happen with class names.

I created pr #2038 for this.
While I was on it, I found and fixed a hidden problem in objectSupport (the subtract method was based on the fact that subtracting is adding a negative value - which is true for numbers only).

[iamkun]

fixed via #2038