feat(v-dialog): adds click:outside call

[rkomiyama]

Description

Adds an emitter which emits click:outside when the closeConditional() gets called.

Duplicate of this PR: #5593

Motivation and Context

Fixes #5533

How Has This Been Tested?

A new unit test has been created to check if click:outside has been called.

Markup:

<template>
  <div id="app">
    <v-app>
      <v-content>
        <v-container grid-list-xl>
          <v-layout row justify-center>
            <v-dialog
              v-model="open"
              persistent
              @click:outside="callback"
              width="300"
            >
              <v-btn slot="activator"> Open </v-btn>
              <v-card>
                My Dialog Content
              </v-card>
            </v-dialog>
            <v-dialog
              v-model="areYouSureDialog"
              persistent
              width="300"
            >
              <v-card>
                <v-flex>
                  Are you sure?
                </v-flex>
                <v-flex>
                  <v-btn @click="closeBoth"> Yes </v-btn>
                  <v-btn @click="areYouSureDialog = false"> No </v-btn>
                </v-flex>
              </v-card>
            </v-dialog>
          </v-layout>
        </v-container>
      </v-content>
    </v-app>
  </div>
</template>

<script>
export default {
  name: 'app',
  components: {
  },
  methods: {
    callback() {
      this.areYouSureDialog = true;
    },
    closeBoth() {
      this.open = false;
      this.areYouSureDialog = false;
    }
  },
  data: () => ({
    open: false,
    areYouSureDialog: false
  })
}
</script>

<style lang="scss" scoped>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Improvement/refactoring (non-breaking change that doesn't add any feature but make things better)

Checklist:

• The PR title is no longer than 64 characters.
• The PR is submitted to the correct branch (master for bug fixes and documentation updates, dev for new features and breaking changes).
• My code follows the code style of this project.
• I've added relevant changes to the documentation (applies to new features and breaking changes in core library)

[codecov]

Codecov Report

Merging #6719 into next will increase coverage by 0.07%.
The diff coverage is 100%.

@@            Coverage Diff             @@
##             next    #6719      +/-   ##
==========================================
+ Coverage   81.85%   81.92%   +0.07%     
==========================================
  Files         329      329              
  Lines        8438     8439       +1     
  Branches     2138     2138              
==========================================
+ Hits         6907     6914       +7     
+ Misses       1440     1434       -6     
  Partials       91       91

Impacted Files	Coverage Δ
packages/vuetify/src/components/VDialog/VDialog.ts	66.66% <100%> (+3.83%)	⬆️
packages/vuetify/src/mixins/stackable/index.ts	100% <0%> (+10.52%)	⬆️

---

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 59bbe2a...1d33aa4. Read the comment docs.

[dsseng]

@rkomiyama looks like you have opened feature PR to master, but now all features should go to next. Could you please change base to next and resolve merge conflicts if they happen.
Thank you for your contribution and interest in improving Vuetify! Make sure to join us in the Discord community.

[johnleider]

I've updated the target branch to next. This looks okay and as v-dialog hasn't been touched yet I'm okay with this going in. @vuetifyjs/core-team any objections?

[nekosaur]

Fine with me

[MajesticPotatoe]

sounds good.

[johnleider]

Fix merge conflicts and we'll approve.

[vercel]

This pull request is automatically deployed with Now.
To access deployments, click Details below or on the icon next to each push.

[dsseng]

@rkomiyama looks like there still are some merge conflicts

[rkomiyama]

@rkomiyama looks like there still are some merge conflicts

Yeah I'm not sure why. I rebased with the latest dev but it's not showing any merge conflicts on my end :\

[rkomiyama]

Could someone please click on the "Resolve conflicts" button to see what exactly is causing this? I feel like this might be an issue of GitHub and Git comparing branches in different ways.

[KaelWD]

Rebase onto next, not dev

[TravisBuddy]

Hey @rkomiyama,
Your changes look good to me!

View build log

TravisBuddy Request Identifier: dfc03d80-5624-11e9-8811-9d5afad75740

[rkomiyama]

There seems to be some issues with the existing tests in the next branch.

Edit: Never mind, it was an issue with not using the new mountFunction.

[MajesticPotatoe]

There seems to be some issues with the existing tests in the next branch.

Along side the few other edits that need to be done in the review (these are all converts to vue-test-utils)
Seems like you need mocks for theme. (see comment below about const wrapper = mountFunction({

[MajesticPotatoe]

👍