Drawer: fix focus bug (ElemeFE#20626)

Co-authored-by: wp178491 <[email protected]>

Author: 2 people

packages/drawer/src/main.vue

@@ -26,7 +26,7 @@
           >
           <header class="el-drawer__header" id="el-drawer__title" v-if="withHeader">
             <slot name="title">
-              <span role="heading" tabindex="0" :title="title">{{ title }}</span>
+              <span role="heading" :title="title">{{ title }}</span>
             </slot>
             <button
               :aria-label="`close ${title || 'drawer'}`"
@@ -49,7 +49,6 @@
 <script>
 import Popup from 'element-ui/src/utils/popup';
 import emitter from 'element-ui/src/mixins/emitter';
-import Utils from 'element-ui/src/utils/aria-utils';
 
 export default {
   name: 'ElDrawer',
@@ -133,9 +132,6 @@ export default {
           document.body.appendChild(this.$el);
         }
         this.prevActiveElement = document.activeElement;
-        this.$nextTick(() => {
-          Utils.focusFirstDescendant(this.$refs.drawer);
-        });
       } else {
         if (!this.closed) this.$emit('close');
         this.$nextTick(() => {

packages/theme-chalk/src/drawer.scss

@@ -119,6 +119,7 @@ $directions: rtl, ltr, ttb, btt;
   0 16px 24px 2px rgba(0, 0, 0, 0.14),
   0 6px 30px 5px rgba(0, 0, 0, 0.12);
   overflow: hidden;
+  outline: 0;
 
   @each $direction in $directions {
     @include animation-out($direction);