未提交代码的组件权限控制设计：

权限系统-1.资源配置

目前权限系统的权限控制粒度能控制到按钮级别，按钮和接口权限同步，同时保证前端实现权限控制的同时，保证后端服务的安全（接口权限）

一：菜单入口

权限配置->资源配置

二：权限配置

1.通过菜单入口进入权限资源配置页面

2.添加对应的资源权限

a.组件名：该值是按钮所属页面组件的名称（）

b.组件id：该值是开发自己赋予的值（该值要确保在当前页面是唯一的）

c.接口：该按钮功能下对应的接口权限（按钮可能存在一对多的情况，目前支持单一接口的权限）

d.接口类型：略

e.角色：按钮和接口对应的角色

f.是否生效：略

三：前端组件使用

目前前端提供了两个权限组件用于权限控制（auth.js、has.js）

1.指令 v-auth

使用该指令后，就可以通过页面配置权限的方式动态的给使用该指令的按钮分配权限

对于需要权限控制的按钮

例如资源配置里的删除按钮

<el-button v-auth="{id:'deleteResource',component:'ResourceConfig'}" icon="el-icon-delete" @user1="deleteResourceConfig(scope.row)" type="text"
                                   class="oper-button"
                                   style="color:#EE6F6F"></el-button>

v-auth指令中两个必须参数；id该页面中该按钮的唯一标识；component为当前组件的name；

注意：在确认使用 v-has 的时候必须在该组件测 created 方法中加入 this.$auth()；

如图：

所以前端使用 v-auth 指令分两三步：

• 1.在需要的按钮上加上 v-auth（并添加唯一的标识 id，同时加上当前组件 name）
• 2.在当前组件的 created 方法调用 this.$auth()
• 3.请到配置页面配置相应的按钮权限

2.v-has 指令

v-has指令属于前端控制指令、仅对前端的按钮做权限控制，适合资源配置页面，虽然资源配置页面也使用v-auth指令，但是对于资源配置页面的按钮权限来说，使用v-has更加合适

<el-button v-has="['admin']" style="float: right; padding: 3px 0" type="text" @user2="addResource">添加</el-button>

v-has 指令的参数为数组形式，可以加入多个角色，在这里个人不推荐使用 id 作为参数，而是采用 code

前端指令代码

1.auth.js

function install(Vue, options = {}) {
    Vue.directive(options.name || "auth", {
        inserted(el, binding) {
            if (!check(binding.value)) {
                el.parentNode && el.parentNode.removeChild(el);
            }
        }
    });
}

function getCurrentAuthority() {
    return JSON.parse(localStorage.getItem("roleIds"));
}

function check(authInfo) {
    const currentAuthority = getCurrentAuthority();
    alert(this.$options.name);
    let auth = localStorage.getItem(authInfo.component);
    let authJson = JSON.parse(auth);
    for (let authData of authJson) {
        if (authData.authId == authInfo.id) {
            return currentAuthority.some(item => authData.roleIds.includes(item));
        }
    }
    return false;
}

export default {install};

2.has.js

function install(Vue, options = {}) {
    Vue.directive(options.name || "has", {
        inserted(el, binding) {
            if (!check(binding.value)) {
                el.parentNode && el.parentNode.removeChild(el);
            }
        }
    });
}


function getCurrentAuthority() {
    return JSON.parse(localStorage.getItem("roleCodes"));
}

function check(roles) {
    return getCurrentAuthority().some(item => roles.includes(item));;
}

export default {install};

四：后端接口控制

对于在资源配置页面配置过的接口需要在后端接口加上相应的权限标识，以让配置生效

例如在上面配置的删除资源配置的权限接口可以加上@ApiPermission注解以让该接口的权限生效

注解@ApiPermission的使用

@Target(ElementType.METHOD)
@Retention(RetentionPolicy.RUNTIME)
public @interface ApiPermission {

    Role[] roles() default ALL;

    boolean dynamic() default true;

    RoleGroup[] groups() default RoleGroup.ALL;

    enum RoleGroup {
        ALL
    }

}

目前该注解有三个参数：roles、dynamic、groups

groups 可以忽略

roles和dynamic是成对出现的，如果我们不想动态配置接口的权限，可以将dynamic设置为false，然后设置roles，否则单独设置roles并不会生效，因为默认情况dynamic为true会从数据库读取相关角色信息

当你看到 100 份简历，90 份内容相似的时候……
起初在大公司，这种问题给供应商和 HR 施压就少很多，但是后来就感觉有点恼火了，终于发现思寒老板搞高端培训是多么的有眼光了

这句就理解不了：

扫描出的 bug 按照 red、safe、block、serious、risk、warning、style、suggestion、normal 顺序排列展示

赶脚照着这个分类，还应该有 green、dangerous、joke 啥的

提交的时候不知道怎么漏掉了，已经好了

@0x88 你要的东西来了

一条 SAR 走天下

这么跟你说吧：
1、同一拨人写前端，以前用 jq 习惯加 ID 的用 vue 也会加，现在用 vue 不加 id 的人写 jq 也不会加的
2、再者，class 无论是用 jq 还是 vue，都必须有的，除非前端无样式，cssSelector 也是可以用的
3、xpath 写的不好维护不是因为 xpath 本身，而是写的人没写好，多用相对路径配合 class-name、id、text，也是很好维护的，至于那么几毫秒的性能差别在 UI 自动化测试中基本体现不出来，可以忽略不计
4、我不知道新版的 selenium 对 vue 的 refs 有没有支持，如果没有你可以去selenium 官方提一个 feature request 来支持 FindBy.refs，因为写 vue 加 ref 的几率的确要比 ID 高很多倍

平均 TPS 达到 2666 并且平均响应时间小于 5s

看起来你的并发数需要 13330 起步啊，这个需要多少分布式负载客户端和带宽呀，想想我都头大
如果响应时间能优化到 0.5s，做起来就舒心多了

lombok 不是这么用的

那也有 84W 啦，可以不可以应聘进去做个打杂小文秘，专司此事呢

擦，280+，假设平均每个奖励 5000，楼主这一项收入 140W 啊

已批复同意，我可以开始准备文档说明了，争取 2 周之内吧，激动吗

vdom V 只是 V 在运算中不需要反复渲染而已，又不是说最终到浏览器上了也不渲染，具体难点在哪里能不能说一下，没明白到底有啥问题是不能支持的
而且 vue 官方推荐的测试框架里面就有 selenium，我记得以前用 vue-cli 初始化一个工程出来，test 里面就有 selenium 的内容

https://github.com/vuejs/vue/blob/4821149b8bbd4650b1d9c9c3cfbb539ac1e24589/package.json
搜 selenium

领导认为，项目开发完成后，包括迭代开发完成，流程里面要把验收加进来，但是应该由测试出具 ‘验收文档’，再把验收情况结果纳入测试报告中展示，并由测试决策，这次上不上线。

我觉得你领导说的没啥问题，是你过度解读了而已，至于那个由测试决策……其实只是说决策质量或者测试这个工作环节的成果是否达成出口标准了，未达成，测试有一票否决权而已，否则难不成需求都没做完测试就有权力要求必须上线？

分那么清楚干啥……测试也是人家做，你无非就是帮忙把报告一起发了啊，这 SIT、UAT 两份报告少一份怎么能够上线呢？
我觉得你可能就是不想去写那个报告而已，如果都是系统自动给你生成了，你还会纠结这个问题吗？

以前平安科技就是这么做的
而验收测试用例，要么业务/用户自己写，要么让他们从测试组的 case 里面挑选一部分做，没啥不妥

实际上因为客户端 app 上线了，但是那晚后台开发同事未加班，后台 api 及数据未同步上线，从而导致这个问题，测试 leader 辞退

笑死我了~

今晚发完版本之后，明天整理 lic 和开源申请到法务

做技术建议选安全，不想做技术这两样你都别碰

重新渲染——在父组件用 v-if 控制一下就行了，这点开销还是没所谓的

<mainEditor :minds="mindText" v-if="showMind"></mainEditor>

基本所有 canvas 和 svg 框架做的图形图表数据刷新貌似都需要重新渲染

没支持文件导入功能，可以从 localStorage 导入或者通过父组件传值进来，保证 JSON 格式
建议自己去搜一下 vue 父子组建通讯方式

子组件：

<script>
export default {
  data() {
    return {
      mindText: ""
    };
  },

  mounted() {
    var Editor = require("../../script/editor");
    var el = this.$el;
    var editor = (window.editor = new Editor(el));
    this.setEditor(editor);

    if (this.minds) {
      this.mindText = JSON.parse(this.minds);
      editor.minder.importJson(this.mindText);
      window.localStorage.mindText = this.minds;
    } else if (window.localStorage.mindText) {
      editor.minder.importJson(JSON.parse(window.localStorage.mindText));
      this.mindText = JSON.parse(window.localStorage.mindText);
    }

    editor.minder.on("contentchange", function() {
      window.localStorage.mindText = JSON.stringify(editor.minder.exportJson());
    });

    editor.minder.execCommand("camera", editor.minder.getRoot(), 600);

    window.minder = window.km = editor.minder;
    this.setMinder(editor.minder);
    this.executeCallback();
  },

  ......

  props: ["minds"]
};
</script>

父组件

<template>
  <div>
    <div class="main-container">
      <header-menu></header-menu>
      <mainEditor :minds="mindText"></mainEditor>
      <navigator></navigator>
    </div>
  </div>
</template>

我也支持楼主，不过我有另一层理解：楼主似乎在说，这些技术都不是测试的核心技术
比如你做一个接口测试平台，拿个阿猫阿狗都会的 django/flask+vue+iview 啥的，除了学会构建一个 web 的 demo 根本不构成任何能力
关键的是如何打通关键的相干性技术：如何支持多种协议、如何支持多种格式的请求报文和返回，如何构建与之匹配的多层 mock 服务，等等……
这些东西很单薄，别人写个 httpclient 你就包一层，甚至连二次封装可能都没做过，也没考虑过是否基于 rest-assured 会更合适，流于 CRUD 的确很可悲。
我在别的帖子里也提过，github 上那么多开源的 XX 平台，9 成 9 我看了代码都没有 fork 的欲望……没有经过设计，没有扩展性，看起来比我的代码还烂，既然这样，还不如自己先凑合一下
总结一下：开源 XX 平台烂大街，没有形成合力，没有技术指导，不知道黄老板的学院有没有兴趣组织整合一下，搞两个在国际上能拿得出手的框架、工具、平台~

木有
这周我找领导问一下能不能申请开源

给你个建议，框架你选什么开发的都没所谓，平台记得不要选 python、ruby 做的，依赖太复杂，除非 bitnami 上有集成包~
另外，github 上还真没有什么成熟且易用、易维护、易二次开发的测试平台，因为成熟的都在大厂内部应用，个性定制化特点很突出，很少开源，开源的好像也就去哪儿的yapi相对好点，但是纯 js 开发的，二次开发上手难度比较大。
社区里都是技术大佬，对这种 “成熟” 的要求都无所谓的，我们这种老大爷可能才会敏感一些~

发到圈子里面，外面的人看得到吗？